<template>
    <div class="page_root" :key="queryUpdateFlag" data-page-name="里程碑进度" data-page-identification="j_3uh1p7b3u4">
        <a-spin :spinning="pageLoading.loading" :tip="pageLoading.tip">
            <!-- begin vid_486bv26odh 自定义模板_vnu1izs281 -->
            <!--            转任务-->
            <a-modal
                :visible="taskState.otherTaskVisible"
                :title="taskState.otherTaskTitle"
                centered
                width="1000px"
                @ok="confirmOtherMb"
                :ok-button-props="{ loading: taskState.otherOkLoading }"
                @cancel="cancelOtherMb"
                destroy-on-close
            >
                <div class="mbtask-form">
                    <a-form :model="taskState.otherTaskForm" ref="ptOtherRef">
                        <div v-for="(item, index) in taskState.otherTaskForm.taskList" :key="index" class="form-item">
                            <a-row>
                                <a-col :span="24">
                                    {{ useProjectId }}外层项目名称
                                    {{ taskState.otherTaskForm.taskList[index].projectId }}内部名称
                                    <a-form-item
                                        label="产品线"
                                        :name="['taskList', index, 'projectId']"
                                        :rules="{ required: true, message: '请选择产品线!' }"
                                    >
                                        <a-tree-select
                                            v-model:value="taskState.otherTaskForm.taskList[index].projectId"
                                            show-search
                                            style="width: 100%"
                                            placeholder="请选择"
                                            allow-clear
                                            treeDefaultExpandAll
                                            :tree-data="taskState.projectTree"
                                            :fieldNames="{
                                                children: 'children',
                                                label: 'projectName',
                                                value: 'projectId',
                                                key: 'projectId'
                                            }"
                                            @change="getPopleList"
                                            treeNodeFilterProp="projectName"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="24">
                                    <a-form-item
                                        label="任务名称"
                                        :name="['taskList', index, 'taskName']"
                                        :rules="[
                                            {
                                                required: true,
                                                message: '请输入任务名称!'
                                            },
                                            {
                                                validator: () => {
                                                    if (taskState.otherTaskForm.taskList[index].taskName) {
                                                        if (taskState.otherTaskForm.taskList[index].taskName.trim()) {
                                                            return PromiseProxy.resolve()
                                                        } else {
                                                            return PromiseProxy.reject('请输入任务名称!')
                                                        }
                                                    } else {
                                                        return PromiseProxy.resolve()
                                                    }
                                                }
                                            }
                                        ]"
                                    >
                                        <a-input
                                            :placeholder="inputHolder"
                                            v-model:value="taskState.otherTaskForm.taskList[index].taskName"
                                        />
                                    </a-form-item>
                                </a-col>
                            </a-row>
                            <a-row>
                                <a-col :span="12">
                                    <a-form-item
                                        label="所属用户故事"
                                        :name="['taskList', index, 'storyId']"
                                        :rules="{ required: true, message: '请选择所属用户故事!' }"
                                    >
                                        <a-select
                                            :placeholder="selectHolder"
                                            v-model:value="taskState.otherTaskForm.taskList[index].storyId"
                                            showSearch
                                            :options="taskState.storyList"
                                            :field-names="{ label: 'label', value: 'value' }"
                                            :filter-option="
                                                (input, option) => {
                                                    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            @change=""
                                            @focus="getStory"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="12">
                                    <a-form-item label="所属SOP任务">
                                        <!--                                        :name="['taskList', index, 'parentId']" :rules="{ required: true, message:-->
                                        <!--                                        '请选择父级任务!' }"-->
                                        <a-tree-select
                                            placeholder="请选择所属SOP任务"
                                            v-model:value="taskState.otherTaskForm.taskList[index].parentId"
                                            allowClear
                                            showSearch
                                            :tree-data="taskState.otherTaskForm.taskList[index].sopTaskList"
                                            :field-names="{ label: 'taskName', value: 'taskId' }"
                                            :filter-option="
                                                (input, option) => {
                                                    return (
                                                        option.taskName.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                    )
                                                }
                                            "
                                        />
                                    </a-form-item>
                                </a-col>
                            </a-row>
                            <a-col :span="24">
                                <a-form-item
                                    label="优先级"
                                    :name="['taskList', index, 'priorityDigit']"
                                    :rules="[{ required: true, validator: validatePriority, trigger: 'blur' }]"
                                >
                                    <a-input-number
                                        style="width: 100%"
                                        placeholder="请输入 1 到 99 之间，最多一位小数的正数"
                                        v-model:value="taskState.otherTaskForm.taskList[index].priorityDigit"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-row>
                                <a-col :span="12">
                                    <a-form-item
                                        label="预计投入工时"
                                        :name="['taskList', index, 'workingHours']"
                                        :rules="[
                                            { required: true, message: '请输入预计投入工时!', trigger: 'blur' },
                                            {
                                                pattern: /^(0\.5|[1-9](\d*)?(\.5)?(\.0)?)$/,
                                                message: '请输入大于0的数字(支持0.5的倍数)',
                                                trigger: 'blur'
                                            }
                                        ]"
                                    >
                                        <a-input
                                            placeholder="请输入工时(支持0.5的数字)"
                                            v-model:value="taskState.otherTaskForm.taskList[index].workingHours"
                                            :min="0"
                                            type="number"
                                            suffix="小时"
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="12">
                                    <a-form-item
                                        label="任务起止时间"
                                        :name="['taskList', index, 'allTime']"
                                        :rules="{ required: true, message: '请选择任务起止时间!' }"
                                    >
                                        <a-range-picker
                                            style="width: 100%"
                                            v-model:value="taskState.otherTaskForm.taskList[index].allTime"
                                            valueFormat="YYYY-MM-DD"
                                        />
                                    </a-form-item>
                                </a-col>
                            </a-row>
                            <a-row>
                                <a-col :span="12">
                                    <a-form-item
                                        label="任务负责人"
                                        :name="['taskList', index, 'taskOwner']"
                                        :rules="{ required: true, message: '请选择任务负责人!' }"
                                    >
                                        <a-select
                                            :placeholder="selectHolder"
                                            v-model:value="taskState.otherTaskForm.taskList[index].taskOwner"
                                            showSearch
                                            :options="lhwtState.allUser"
                                            :field-names="{ label: 'name', value: 'name' }"
                                            :filter-option="
                                                (input, option) => {
                                                    return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                        />
                                    </a-form-item>
                                </a-col>
                                <a-col :span="12">
                                    <a-form-item
                                        label="审核员"
                                        :name="['taskList', index, 'assessorName']"
                                        :rules="{ required: false, message: '请选择审核员!' }"
                                    >
                                        <a-select
                                            :placeholder="selectHolder"
                                            v-model:value="taskState.otherTaskForm.taskList[index].assessorName"
                                            showSearch
                                            :options="lhwtState.allUser"
                                            :field-names="{ label: 'name', value: 'name' }"
                                            :filter-option="
                                                (input, option) => {
                                                    return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                        />
                                    </a-form-item>
                                </a-col>
                            </a-row>
                            <a-row>
                                <a-col :span="24">
                                    <a-form-item
                                        label="任务执行人"
                                        :name="['taskList', index, 'taskParticipantList']"
                                        :rules="{ required: true, message: '请选择任务参与人!' }"
                                    >
                                        <a-select
                                            :placeholder="selectHolder"
                                            v-model:value="taskState.otherTaskForm.taskList[index].taskParticipantList"
                                            showSearch
                                            mode="multiple"
                                            :options="lhwtState.allUser"
                                            :field-names="{ label: 'name', value: 'value' }"
                                            :filter-option="
                                                (input, option) => {
                                                    return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                        />
                                    </a-form-item>
                                </a-col>
                            </a-row>
                            <a-row>
                                <a-col v-if="taskPeopleList.length > 0" :span="22">
                                    <div style="width: 700px; margin-left: 115px; margin-bottom: 28px">
                                        <a
                                            href="javascript:;"
                                            v-for="(item, num) in taskPeopleList"
                                            @click="handlerAddOtherPeople(item.value, index)"
                                            ><span style="margin: 0 5px">{{ item.value }}</span></a
                                        >
                                    </div>
                                </a-col>
                            </a-row>
                            <a-row>
                                <a-col :span="24">
                                    <a-form-item label="备注">
                                        <a-textarea
                                            placeholder="请输入备注"
                                            v-model:value="taskState.otherTaskForm.taskList[index].description"
                                        />
                                    </a-form-item>
                                </a-col>
                            </a-row>
                        </div>
                        <!--                        <a-col :span="22">-->
                        <!--                            <a-button @click="handleAddOtherItem" type="primary" ghost> 新增</a-button>-->
                        <!--                        </a-col>-->
                    </a-form>
                </div>
            </a-modal>
            <!--            转任务-->
            <a-modal
                v-model:visible="lhwtState.importVisible"
                title="导入"
                @ok="handleImport"
                centered
                @cancel="inportCancel"
                :ok-button-props="{ loading: lhwtState.importLoading }"
            >
                <a-upload
                    v-model:file-list="lhwtState.inportFileList"
                    :multiple="true"
                    :before-upload="handlerUpload"
                    @remove="handlerRemove"
                >
                    <a-button type="primary"> <upload-outlined />导入</a-button>
                </a-upload>
            </a-modal>
            <!--          必填校验-->
            <a-modal
                v-model:visible="lhwtState.validateVisible"
                @ok="noSaveData"
                @cancel="lhwtState.validateVisible = false"
                title="请确认"
                centered
                :ok-button-props="{ loading: lhwtState.tipLoading }"
            >
                <p>
                    新增数据必填/必选项未补全，完成后将不保存相关数据；取消则继续维持编辑模板，确定则不保存不完整的数据；
                </p>
            </a-modal>
            <!--          必填校验-->
            <!--          转化为faq-->
            <a-modal
                centered
                :visible="faqState.createVisible"
                title="转化为FAQ"
                width="800px"
                @ok="confirmQuestion"
                @cancel="cancalQuestion"
                :body-style="{ padding: '16px', height: '600px', overflowY: 'auto' }"
                :ok-button-props="{ loading: faqState.pzLoading }"
                destroy-on-close
                :maskClosable="false"
            >
                <div class="faq-my-page">
                    <a-form :model="faqState.createList" ref="questionRef">
                        <a-row>
                            <a-col :span="24">
                                <a-form-item label="选择问题">
                                    <a-select
                                        v-model:value="faqState.createList.questionId"
                                        :field-names="{ label: 'label', value: 'value' }"
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                        :options="faqState.questionList"
                                        @change="questionChange"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="24">
                                <a-form-item
                                    label="问题名称"
                                    :rules="[{ required: true, message: '请输入问题名称', trigger: 'blur' }]"
                                    name="problemName"
                                >
                                    <a-input
                                        :disabled="faqState.createList.questionId"
                                        v-model:value="faqState.createList.problemName"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="24">
                                <a-form-item
                                    label="项目阶段"
                                    :rules="[{ required: true, message: '请输入项目阶段', trigger: 'blur' }]"
                                    name="stageNames"
                                >
                                    <a-textarea v-model:value="faqState.createList.stageNames" />
                                </a-form-item>
                            </a-col>
                            <a-col :span="24">
                                <a-form-item
                                    label="标签"
                                    :rules="[{ required: true, message: '请输入标签', trigger: 'blur' }]"
                                    name="labels"
                                >
                                    <a-textarea v-model:value="faqState.createList.labels" />
                                </a-form-item>
                            </a-col>
                            <a-col :span="24">
                                <a-form-item
                                    label="回答"
                                    :rules="[{ required: true, message: '请输入回答', trigger: 'blur' }]"
                                    name="answerStr"
                                >
                                    <QuillEditor
                                        v-model:content="faqState.createList.answerStr"
                                        ref="answerQuillEditor"
                                        :options="editorOption"
                                        class="quill-editor"
                                    />
                                </a-form-item>
                            </a-col>
                        </a-row>
                    </a-form>
                </div>
            </a-modal>
            <!--          转化为faq-->
            <!--          转换为工单-->
            <a-modal
                centered
                v-model:visible="gdState.visible"
                title="转化为工单"
                @ok="submit"
                @cancel="fatherCancel"
                width="1000px"
                destroy-on-close
                :ok-button-props="{ loading: gdState.fatherLoading }"
            >
                <div class="gd-form-content">
                    <a-form :model="gdState.modalForm" ref="gdFormRef">
                        <a-row>
                            <a-col :span="24">
                                <a-form-item
                                    label="工单标题"
                                    :rules="[{ required: true, message: '请输入工单标题', trigger: 'blur' }]"
                                    name="content"
                                >
                                    <a-textarea
                                        maxlength="100"
                                        show-count
                                        placeholder="请输入"
                                        v-model:value="gdState.modalForm.content"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="工单类型"
                                    :rules="[{ required: true, message: '请选择工单类型', trigger: 'blur' }]"
                                    name="type"
                                >
                                    <a-select
                                        :options="[
                                            {
                                                label: '问题转化',
                                                value: '问题转化'
                                            },
                                            {
                                                label: '产品问题',
                                                value: '产品问题'
                                            },
                                            {
                                                label: '数据问题',
                                                value: '数据问题'
                                            },
                                            {
                                                label: '算法问题',
                                                value: '算法问题'
                                            },
                                            {
                                                label: '系统故障',
                                                value: '系统故障'
                                            },
                                            {
                                                label: '产品需求',
                                                value: '产品需求'
                                            },
                                            {
                                                label: '算法需求',
                                                value: '算法需求'
                                            }
                                        ]"
                                        v-model:value="gdState.modalForm.type"
                                        placeholder="请选择"
                                        @change="gdState.modalForm.monitorScene = undefined"
                                    />
                                    <!--                                  @change="hanldeTypeChange"-->
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item label="监控场景">
                                    <a-select
                                        @focus="getMonitorSceneList(false)"
                                        show-search
                                        :options="gdState.monitorSceneList"
                                        v-model:value="gdState.modalForm.monitorScene"
                                        placeholder="请选择"
                                        :field-names="{ label: 'label', value: 'value' }"
                                        :filterOption="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="优先级"
                                    :rules="[{ required: true, message: '请选择优先级', trigger: 'blur' }]"
                                    name="priority"
                                >
                                    <a-select
                                        :disabled="gdState.modalForm.type === '产品需求'"
                                        v-model:value="gdState.modalForm.priority"
                                        :options="[
                                            {
                                                label: 'p0',
                                                value: 'p0'
                                            },
                                            {
                                                label: 'p1',
                                                value: 'p1'
                                            },
                                            {
                                                label: 'p2',
                                                value: 'p2'
                                            },
                                            {
                                                label: 'p3',
                                                value: 'p3'
                                            }
                                        ]"
                                        placeholder="请选择"
                                    />
                                    <!--                                  @change="getSolveTimeByType"-->
                                </a-form-item>
                            </a-col>
                            <a-col :span="12" v-if="gdState.modalForm.type !== '产品需求'">
                                <a-form-item
                                    label="计划解决时长(小时)"
                                    :rules="[
                                        {
                                            pattern: new RegExp(/^(0(\.5)?|[1-9](\d*)?(\.5)?(\.0)?)$/),
                                            message: '请输入大于0的数字(支持0.5的倍数)',
                                            trigger: 'blur'
                                        }
                                    ]"
                                    name="workHours"
                                >
                                    <a-input-number
                                        placeholder="请输入"
                                        v-model:value="gdState.modalForm.workHours"
                                        @change="getSolveTime"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="计划解决时间"
                                    :rules="[{ required: true, message: '请选择计划解决时间', trigger: 'blur' }]"
                                    name="endTime"
                                >
                                    <a-date-picker
                                        show-time
                                        placeholder="请选择"
                                        v-model:value="gdState.modalForm.endTime"
                                        value-format="YYYY-MM-DD HH:mm:ss"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="问题来源"
                                    :rules="[{ required: true, message: '请选择问题来源', trigger: 'blur' }]"
                                    name="questionSource"
                                >
                                    <a-select
                                        disabled
                                        v-model:value="gdState.modalForm.questionSource"
                                        placeholder="请选择"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="所属区域"
                                    :rules="[{ required: true, message: '请选择所属区域', trigger: 'blur' }]"
                                    name="areaCode"
                                >
                                    <a-select
                                        allow-clear
                                        show-search
                                        :options="gdState.areaList"
                                        placeholder="请选择"
                                        v-model:value="gdState.modalForm.areaCode"
                                        @focus="getAreaList"
                                        :field-names="{ label: 'label', value: 'value' }"
                                        :filter-option="
                                            (input, option) => {
                                                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                        @change="gdAreaChange"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="所属客户"
                                    :rules="[{ required: false, message: '请输入所属客户', trigger: 'blur' }]"
                                    name="customer"
                                >
                                    <a-select
                                        allow-clear
                                        show-search
                                        :options="gdState.customList"
                                        placeholder="请选择"
                                        v-model:value="gdState.modalForm.customer"
                                        @focus="getCustomerList"
                                        :field-names="{ label: 'name', value: 'name' }"
                                        :filter-option="
                                            (input, option) => {
                                                return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                        @change="customerChange"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="所属项目"
                                    :rules="[{ required: true, message: '请选择所属项目', trigger: 'blur' }]"
                                    name="projectId"
                                >
                                    <a-select
                                        allow-clear
                                        show-search
                                        :options="gdState.projectList"
                                        placeholder="请选择"
                                        v-model:value="gdState.modalForm.projectId"
                                        :field-names="{ label: 'projectName', value: 'projectId' }"
                                        :filter-option="
                                            (input, option) => {
                                                return (
                                                    option.projectName.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                )
                                            }
                                        "
                                        @focus="getProjectList"
                                        @change="projectChange"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="环境"
                                    :rules="[{ required: false, message: '请选择环境', trigger: 'blur' }]"
                                    name="environment"
                                >
                                    <a-select
                                        show-search
                                        allow-clear
                                        :options="gdState.environmentList"
                                        placeholder="请选择"
                                        v-model:value="gdState.modalForm.environment"
                                        :field-names="{ label: 'name', value: 'name' }"
                                        :filter-option="
                                            (input, option) => {
                                                return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                        @focus="getEnvironmentList"
                                        @change="environmentChange"
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item
                                    label="所属产品"
                                    :rules="[{ required: false, message: '请选择所属产品', trigger: 'blur' }]"
                                    name="production"
                                >
                                    <a-select
                                        show-search
                                        allow-clear
                                        :options="gdState.productList"
                                        placeholder="请选择"
                                        v-model:value="gdState.modalForm.production"
                                        @change="productChange"
                                        @focus="getProductList"
                                        :field-names="{ label: 'name', value: 'name' }"
                                        :filter-option="
                                            (input, option) => {
                                                return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                            }
                                        "
                                    />
                                </a-form-item>
                            </a-col>
                            <a-col :span="12">
                                <a-form-item label="版本">
                                    <a-input v-model:value="gdState.modalForm.version" disabled />
                                </a-form-item>
                            </a-col>
                        </a-row>
                        <div class="description-tip" v-if="currentData.status !== '未开始' && currentData.status"
                            ><ExclamationCircleFilled class="tip-img" /> 解决中的工单不支持编辑问题描述</div
                        >
                        <a-row
                            :style="{
                                pointerEvents:
                                    currentData.status === '未开始' ||
                                    !currentData.status ||
                                    currentData.status === '待分发'
                                        ? 'auto'
                                        : 'none'
                            }"
                        >
                            <a-col :span="24">
                                <a-form-item
                                    label="问题&风险描述"
                                    :rules="[{ required: true, message: '请输入问题&风险描述', trigger: 'blur' }]"
                                    name="qillData"
                                >
                                    <QuillEditor
                                        v-model:content="gdState.modalForm.qillData"
                                        ref="quillEditor"
                                        :options="editorOption"
                                        class="quill-editor"
                                    />
                                </a-form-item>
                            </a-col>
                        </a-row>
                        <!--                        <a-row>-->
                        <!--                            <a-col :span="24">-->
                        <!--                                <a-form-item-->
                        <!--                                    label="解决人"-->
                        <!--                                    :rules="[{ required: true, message: '请选择解决人', trigger: 'blur' }]"-->
                        <!--                                    name="solverList"-->
                        <!--                                >-->
                        <!--                                    <a-select-->
                        <!--                                        class="remove-icon"-->
                        <!--                                        show-search-->
                        <!--                                        mode="multiple"-->
                        <!--                                        :options="gdState.allUser"-->
                        <!--                                        v-model:value="gdState.modalForm.solverList"-->
                        <!--                                        placeholder="请选择"-->
                        <!--                                        :field-names="{ label: 'name', value: 'name' }"-->
                        <!--                                        :filter-option="-->
                        <!--                                            (input, option) => {-->
                        <!--                                                return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0-->
                        <!--                                            }-->
                        <!--                                        "-->
                        <!--                                        @change="fatherSolverChange"-->
                        <!--                                    />-->
                        <!--                                </a-form-item>-->
                        <!--                            </a-col>-->
                        <!--                        </a-row>-->
                        <!--                        &lt;!&ndash;                      <a-col v-if="taskPeopleList.length > 0">&ndash;&gt;-->
                        <!--                        <a-col>-->
                        <!--                            <div style="width: 700px; margin-left: 135px; margin-bottom: 16px">-->
                        <!--                                <a-->
                        <!--                                    href="javascript:;"-->
                        <!--                                    v-for="(item, num) in taskPeopleList"-->
                        <!--                                    @click="handlerAddPeople(item.value, index)"-->
                        <!--                                    ><span style="margin: 0 5px">{{ item.value }}</span></a-->
                        <!--                                >-->
                        <!--                            </div>-->
                        <!--                        </a-col>-->
                        <a-col :span="24">
                            <a-form-item label="上传附件">
                                <a-upload
                                    v-model:file-list="gdState.modalForm.descriptionAttachmentList"
                                    :multiple="true"
                                    :before-upload="handlerFatherUpload"
                                    @remove="handlerFatherRemove"
                                    accept=".xlsx, image/*,.docx,, .xls,.mp4"
                                >
                                    <a-button type="primary">
                                        <upload-outlined />
                                        上传
                                    </a-button>
                                </a-upload>
                                <span>支持格式：.xlsx, image/*,.docx,, .xls,.mp4</span>
                            </a-form-item>
                        </a-col>
                    </a-form>
                </div>
            </a-modal>
            <!--          转换为工单-->

            <div class="top-search">
                <a-form>
                    <a-row style="margin-bottom: 10px" :gutter="16">
                        <a-col :span="5">
                            <a-form-item label="区域" :label-col="{ span: 5 }" :wrapper-col="{ span: 19 }">
                                <a-select
                                    allow-clear
                                    show-search
                                    v-model:value="lhwtState.filter.areaCode"
                                    :options="lhwtState.areaNameList"
                                    placeholder="请选择"
                                    :field-names="{ label: 'label', value: 'value' }"
                                    :filterOption="
                                        (input, option) => {
                                            return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                        }
                                    "
                                    :max-tag-count="2"
                                    :getPopupContainer="getPopupContainer"
                                />
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item label="项目总监" :label-col="{ span: 5 }" :wrapper-col="{ span: 19 }">
                                <a-select
                                    allow-clear
                                    show-search
                                    v-model:value="lhwtState.filter.projectDirector"
                                    :options="lhwtState.allUser"
                                    placeholder="请选择"
                                    :field-names="{ label: 'name', value: 'name' }"
                                    :filterOption="
                                        (input, option) => {
                                            return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                        }
                                    "
                                    :max-tag-count="2"
                                    :getPopupContainer="getPopupContainer"
                                />
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item label="项目经理" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
                                <a-select
                                    allow-clear
                                    show-search
                                    v-model:value="lhwtState.filter.pmName"
                                    :options="lhwtState.allUser"
                                    placeholder="请选择"
                                    :field-names="{ label: 'name', value: 'name' }"
                                    :filterOption="
                                        (input, option) => {
                                            return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                        }
                                    "
                                    :max-tag-count="2"
                                    :getPopupContainer="getPopupContainer"
                                />
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item label="问题类型" :label-col="{ span: 5 }" :wrapper-col="{ span: 19 }">
                                <a-tree-select
                                    v-model:value="lhwtState.filter.questionTypeSecond"
                                    show-search
                                    treeDefaultExpandAll
                                    style="width: 100%"
                                    placeholder="请选择"
                                    allow-clear
                                    :tree-data="lhwtState.wtlxList"
                                    :fieldNames="{
                                        children: 'children',
                                        label: 'itemName',
                                        value: 'itemName',
                                        key: 'itemCode'
                                    }"
                                    :filterTreeNode="
                                        (inputValue, treeNode) => {
                                            return (
                                                treeNode.itemName.toLowerCase().indexOf(inputValue.toLowerCase()) >= 0
                                            )
                                        }
                                    "
                                    :max-tag-count="1"
                                />
                            </a-form-item>
                        </a-col>
                        <a-col :span="4">
                            <a-form-item label="解决方案" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
                                <a-select
                                    allow-clear
                                    show-search
                                    placeholder="请选择"
                                    :options="lhwtState.jjfaList"
                                    v-model:value="lhwtState.filter.solution"
                                    :getPopupContainer="getPopupContainer"
                                />
                            </a-form-item>
                        </a-col>
                    </a-row>
                    <a-row :gutter="16">
                        <a-col :span="5">
                            <a-form-item label="FAQ" :label-col="{ span: 5 }" :wrapper-col="{ span: 19 }">
                                <a-select
                                    show-search
                                    allow-clear
                                    placeholder="请选择"
                                    v-model:value="lhwtState.filter.faq"
                                    :options="lhwtState.faqList"
                                />
                            </a-form-item>
                        </a-col>
                        <a-col :span="5">
                            <a-form-item label="体系闭环" :label-col="{ span: 5 }" :wrapper-col="{ span: 19 }">
                                <a-select
                                    show-search
                                    allow-clear
                                    placeholder="请选择"
                                    :options="lhwtState.txbhList"
                                    v-model:value="lhwtState.filter.systemClosedLoop"
                                    :getPopupContainer="getPopupContainer"
                                />
                            </a-form-item>
                        </a-col>
<!--                        <a-col :span="5">-->
<!--                            <a-form-item label="转工单状态" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">-->
<!--                                <a-select-->
<!--                                    allow-clear-->
<!--                                    show-search-->
<!--                                    v-model:value="lhwtState.filter.workOrderStatus"-->
<!--                                    :options="lhwtState.finishStatusList"-->
<!--                                    placeholder="请选择"-->
<!--                                    :field-names="{ label: 'label', value: 'value' }"-->
<!--                                    :filterOption="-->
<!--                                        (input, option) => {-->
<!--                                            return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0-->
<!--                                        }-->
<!--                                    "-->
<!--                                    :getPopupContainer="getPopupContainer"-->
<!--                                />-->
<!--                            </a-form-item>-->
<!--                        </a-col>-->
                        <a-col :span="5">
                            <a-form-item label="风险类型" :label-col="{ span: 5 }" :wrapper-col="{ span: 19 }">
                                <a-select
                                    allow-clear
                                    show-search
                                    v-model:value="lhwtState.filter.riskType"
                                    :options="lhwtState.fxlxList"
                                    placeholder="请选择"
                                    :field-names="{ label: 'itemName', value: 'itemName' }"
                                    :filterOption="
                                        (input, option) => {
                                            return option.itemName.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                        }
                                    "
                                    :getPopupContainer="getPopupContainer"
                                />
                            </a-form-item>
                        </a-col>
                        <a-col :span="4">
                            <a-space :size="16">
                                <a-button type="primary" @click="getData">查询</a-button>
                                <a-button type="primary" @click="resetData" ghost>重置</a-button>
                            </a-space>
                        </a-col>
                    </a-row>
                </a-form>
            </div>
            <div class="body">
                <div class="main">
                    <div class="table-tip">
                        <div class="left-top">
                            <div class="tip-title">问题列表 </div>
                        </div>
                        <div class="right-top">
                            <a-button type="primary" :href="lhwtState.templateUrl">模板下载</a-button>

                            <a-button type="primary" @click="lhwtState.importVisible = true"> 导入</a-button>
                            <a-button type="primary" @click="handleExport" :loading="lhwtState.exportLoading"
                                >导出</a-button
                            >
                            <a-button type="primary" @click="handleAddTable">新建</a-button>
                        </div>
                    </div>
                    <div class="kb-table-box">
                        <a-table
                            :columns="columnState.baseColumns"
                            :dataSource="lhwtState.dataSource"
                            :scroll="{ y: 550 }"
                            :pagination="pagination"
                            :loading="lhwtState.tableLoading"
                            bordered
                            @resizeColumn="handleResizeColumn"
                            :showSorterTooltip="false"
                            ref="tableRef"
                            @change="handleTableChange"
                        >
                            <template #bodyCell="{ record, text, column, index }">
                                <template v-if="column.dataIndex == 'opration'">
                                    <a-space>
                                        <a-button
                                            size="small"
                                            type="link"
                                            @click="handleAddSonTask(record)"
                                            :disabled="
                                                record.projectType === '交付项目' || !record.projectType || !record.id
                                            "
                                            >转任务</a-button
                                        >
                                        <a-button
                                            size="small"
                                            type="link"
                                            @click="showGd(record)"
                                            :disabled="
                                                record.projectType === '平台项目' ||
                                                record.workOrderNumber ||
                                                !record.id
                                            "
                                            >转工单</a-button
                                        >
                                        <a-button
                                            size="small"
                                            type="link"
                                            @click="showFaq(record)"
                                            :disabled="record.projectType === '平台项目' || !record.id"
                                            >转FAQ</a-button
                                        >
                                        <a-button
                                            size="small"
                                            type="link"
                                            v-if="record.isEdit"
                                            @click="confirmLhwt(record)"
                                            :loading="record.okBtnLoading"
                                            >完成</a-button
                                        >
                                        <a-button
                                            size="small"
                                            type="link"
                                            :disabled="!record.id"
                                            :loading="record.editLoading"
                                            v-else
                                            @click="handleEdit(record)"
                                            >编辑</a-button
                                        >
                                        <a-popconfirm
                                            title="确定删除吗?"
                                            @confirm="confirmDeleteLhwt(record, record.id)"
                                        >
                                            <a-button size="small" type="link">删除</a-button>
                                        </a-popconfirm>
                                    </a-space>
                                </template>
                                <!-- 编辑状态下，展示输入框或选择框 -->
                                <template v-if="record.isEdit">
                                    <!--                                记录日期-->
                                    <template v-if="column.dataIndex === 'meetingDate'">
                                        <!--                                        <div class="validate-content">-->
                                        <a-date-picker
                                            :valueFormat="'YYYY-MM-DD'"
                                            style="width: 100%; padding-left: 12px"
                                            v-model:value="record.meetingDate"
                                            placeholder="选择日期"
                                        />
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                    </template>
                                    <!--                                记录日期-->
                                    <!--                                区域-->
                                    <template v-if="column.dataIndex === 'areaName'">
                                        <!--                                        <div class="validate-content" v-if="record.projectType === '交付项目'">-->
                                        <a-select
                                            v-if="record.projectType === '交付项目'"
                                            allow-clear
                                            show-search
                                            style="width: 100%"
                                            v-model:value="record.areaCode"
                                            :options="lhwtState.areaNameList"
                                            placeholder="请选择"
                                            :field-names="{ label: 'label', value: 'value' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            @change="areaChange(record)"
                                        />
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                        <a-select
                                            v-if="record.projectType === '平台项目'"
                                            allow-clear
                                            show-search
                                            disabled
                                            style="width: 100%"
                                            v-model:value="record.areaCode"
                                            :options="lhwtState.areaNameList"
                                            placeholder="请选择"
                                            :field-names="{ label: 'label', value: 'value' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            @change="areaChange(record)"
                                        />
                                    </template>
                                    <!--                                区域-->
                                    <!--                                会议来源-->
                                    <template v-if="column.dataIndex === 'meetingSources'">
                                        <a-select
                                            style="width: 100%"
                                            allow-clear
                                            mode="multiple"
                                            show-search
                                            v-model:value="record.meetingSourceList"
                                            :options="lhwtState.hylyList"
                                            placeholder="请选择"
                                            :field-names="{ label: 'itemName', value: 'itemName' }"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                    </template>
                                    <!--                                会议来源-->
                                    <!--                                工厂/项目名称-->
                                    <template v-if="column.dataIndex === 'projectShortName'">
                                        <!--                                        <div class="validate-content" v-if="record.projectType === '交付项目'">-->
                                        <a-select
                                            v-if="record.projectType === '交付项目'"
                                            allow-clear
                                            show-search
                                            style="width: 100%"
                                            v-model:value="record.projectId"
                                            :options="lhwtState.projectList"
                                            placeholder="请选择"
                                            :field-names="{ label: 'label', value: 'value' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            @change="factoryChange(record)"
                                            @focus="getFactory(record)"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                        <!--                                        <div class="validate-content" v-if="record.projectType === '平台项目'">-->
                                        <a-select
                                            v-if="record.projectType === '平台项目'"
                                            allow-clear
                                            show-search
                                            style="width: 100%"
                                            v-model:value="record.projectId"
                                            :options="lhwtState.projectNameList"
                                            placeholder="请选择"
                                            :field-names="{ label: 'label', value: 'value' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            @focus="getProjectNameList(record)"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                    </template>
                                    <!--                                 工厂/项目名称-->
                                    <!--                                项目总监-->
                                    <template v-if="column.dataIndex === 'projectDirector'">
                                        <a-select
                                            :disabled="record.projectType === '平台项目'"
                                            allow-clear
                                            show-search
                                            style="width: 100%"
                                            v-model:value="record.projectDirector"
                                            :options="lhwtState.allUser"
                                            placeholder="请选择"
                                            :field-names="{ label: 'name', value: 'name' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            :max-tag-count="2"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                    </template>
                                    <!--                                项目总监-->
                                    <!--                                pmo-->
                                    <template v-if="column.dataIndex === 'pmo'">
                                        <a-select
                                            :disabled="record.projectType === '平台项目'"
                                            allow-clear
                                            show-search
                                            style="width: 100%"
                                            v-model:value="record.pmo"
                                            :options="lhwtState.allUser"
                                            placeholder="请选择"
                                            :field-names="{ label: 'name', value: 'name' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            :max-tag-count="2"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                    </template>
                                    <!--                                pmo-->
                                    <!--                                项目经理-->
                                    <template v-if="column.dataIndex === 'pmName'">
                                        <a-select
                                            :disabled="record.projectType === '平台项目'"
                                            allow-clear
                                            show-search
                                            style="width: 100%"
                                            v-model:value="record.pmName"
                                            :options="lhwtState.allUser"
                                            placeholder="请选择"
                                            :field-names="{ label: 'name', value: 'name' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            :max-tag-count="2"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                    </template>
                                    <!--                                项目经理-->
                                    <!--                                问题&风险描述-->
                                    <template v-if="column.dataIndex === 'questionDescription'">
                                        <!--                                        <div class="validate-content">-->
                                        <a-textarea
                                            v-model:value="record.questionDescription"
                                            placeholder="请输入问题&风险描述"
                                            :rows="1"
                                        />
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                    </template>
                                    <!--                                问题&风险描述-->
                                    <!--                                项目进展状态-->
                                    <template v-if="column.dataIndex === 'projectProgressStatus'">
                                        <!--                                        <div class="validate-content">-->
                                        <!--                                            <a-textarea-->
                                        <!--                                                v-model:value="record.projectProgressStatus"-->
                                        <!--                                                placeholder="请输入项目进展状态"-->
                                        <!--                                                :rows="1"-->
                                        <!--                                            />-->
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                        <a-textarea
                                            v-model:value="record.projectProgressStatus"
                                            placeholder="请输入项目进展状态"
                                            :rows="1"
                                        />
                                    </template>
                                    <!--                                项目进展状态-->
                                    <!--                                风险类型-->
                                    <template v-if="column.dataIndex === 'riskType'">
                                        <!--                                        <div class="validate-content">-->
                                        <a-select
                                            allow-clear
                                            show-search
                                            style="width: 100%"
                                            v-model:value="record.riskType"
                                            :options="lhwtState.fxlxList"
                                            placeholder="请选择"
                                            :field-names="{ label: 'itemName', value: 'itemName' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return (
                                                        option.itemName.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                    )
                                                }
                                            "
                                        />
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                    </template>
                                    <!--                                风险类型-->
                                    <!--                                解决方案及行动项-->
                                    <template v-if="column.dataIndex === 'solutionOrAction'">
                                        <a-textarea
                                            v-model:value="record.solutionOrAction"
                                            :rows="1"
                                            placeholder="请输入解决方案及行动项"
                                        />
                                    </template>
                                    <!--                                解决方案及行动项-->
                                    <!--                                计划解决日期-->
                                    <template v-if="column.dataIndex === 'endTime'">
                                        <a-date-picker
                                            :valueFormat="'YYYY-MM-DD'"
                                            style="width: 100%"
                                            v-model:value="record.endTime"
                                            placeholder="选择日期"
                                        />
                                    </template>
                                    <!--                                计划解决日期-->
                                    <!--                              完成情况反馈  -->
                                    <template v-if="column.dataIndex === 'completionStatusFeedback'">
                                        <a-textarea
                                            v-model:value="record.completionStatusFeedback"
                                            :rows="1"
                                            placeholder="请输入完成情况反馈"
                                        />
                                    </template>
                                    <!--                              完成情况反馈  -->
                                    <!--                              责任人  -->
                                    <template v-if="column.dataIndex === 'responsiblePerson'">
                                        <!--                                        <div class="validate-content">-->
                                        <a-select
                                            allow-clear
                                            show-search
                                            style="width: 100%"
                                            v-model:value="record.responsiblePersonList"
                                            :options="lhwtState.allUser"
                                            mode="multiple"
                                            :max-tag-count="1"
                                            placeholder="请选择"
                                            :field-names="{ label: 'name', value: 'name' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.name.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            :getPopupContainer="getPopupContainer"
                                        />
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                    </template>
                                    <!--                              责任人  -->
                                    <!--                              问题类型  -->
                                    <template v-if="column.dataIndex === 'questionTypeFirst'">
                                        <a-tree-select
                                            v-model:value="record.questionTypeSecond"
                                            show-search
                                            treeDefaultExpandAll
                                            style="width: 100%"
                                            placeholder="请选择"
                                            allow-clear
                                            :tree-data="lhwtState.wtlxList"
                                            :fieldNames="{
                                                children: 'children',
                                                label: 'itemName',
                                                value: 'itemName',
                                                key: 'itemCode'
                                            }"
                                            :filterTreeNode="
                                                (inputValue, treeNode) => {
                                                    return (
                                                        treeNode.itemName
                                                            .toLowerCase()
                                                            .indexOf(inputValue.toLowerCase()) >= 0
                                                    )
                                                }
                                            "
                                            :max-tag-count="1"
                                        />
                                    </template>
                                    <!--                              问题类型  -->
                                    <!--                              项目类型  -->
                                    <template v-if="column.dataIndex === 'projectType'">
                                        <!--                                        <div class="validate-content">-->
                                        <a-select
                                            allow-clear
                                            style="width: 100%"
                                            show-search
                                            v-model:value="record.projectType"
                                            :options="[
                                                {
                                                    label: '交付项目',
                                                    value: '交付项目'
                                                },
                                                {
                                                    label: '平台项目',
                                                    value: '平台项目'
                                                }
                                            ]"
                                            placeholder="请选择"
                                            :field-names="{ label: 'label', value: 'value' }"
                                            :filterOption="
                                                (input, option) => {
                                                    return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
                                                }
                                            "
                                            :max-tag-count="2"
                                            :getPopupContainer="getPopupContainer"
                                            @change="projectTypeChange(record)"
                                        />
                                        <!--                                            <div class="validate-icon"></div>-->
                                        <!--                                        </div>-->
                                    </template>
                                    <!--                              项目类型  -->

                                    <!--                              是否为共性问题  -->
                                    <template v-if="column.dataIndex === 'commonProblems'">
                                        <a-select
                                            allow-clear
                                            style="width: 100%"
                                            placeholder="请选择"
                                            :options="[
                                                {
                                                    label: '是',
                                                    value: '是'
                                                },
                                                {
                                                    label: '否',
                                                    value: '否'
                                                }
                                            ]"
                                            v-model:value="record.commonProblems"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                    </template>
                                    <!--                              是否为共性问题  -->
                                    <!--                              体系闭环  -->
                                    <template v-if="column.dataIndex === 'systemClosedLoop'">
                                        <a-select
                                            show-search
                                            style="width: 100%"
                                            allow-clear
                                            placeholder="请选择"
                                            :options="lhwtState.txbhList"
                                            v-model:value="record.systemClosedLoop"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                    </template>
                                    <!--                              体系闭环  -->
                                    <!--                              解决方案  -->
                                    <template v-if="column.dataIndex === 'solution'">
                                        <a-select
                                            style="width: 100%"
                                            allow-clear
                                            show-search
                                            placeholder="请选择"
                                            :options="lhwtState.jjfaList"
                                            v-model:value="record.solution"
                                            :getPopupContainer="getPopupContainer"
                                        />
                                    </template>
                                    <!--                              解决方案  -->
                                </template>
                                <!-- 非编辑状态下，展示原始文本 -->
                                <template v-else>
                                    <template v-if="['工厂名称'].includes(column.title)">
                                        <div class="db-click-name" :title="text">{{ text }}</div>
                                    </template>
                                    <template v-if="['区域', '日期', '项目总监', '项目经理'].includes(column.title)">
                                        <div class="db-click">{{ text }}</div>
                                    </template>
                                    <template v-if="column.dataIndex === 'solutionOrAction'">
                                        <div class="progress-click">
                                            <a-tooltip
                                                :overlay-style="overStyle"
                                                v-if="record.solutionOrAction"
                                                placement="right"
                                            >
                                                <template #title>
                                                    <p
                                                        v-for="(item, index) in handlerGetSpace(
                                                            record.solutionOrAction
                                                        )"
                                                        :key="index"
                                                        style="margin: 0"
                                                        >{{ item }}</p
                                                    > </template
                                                ><div class="omit-div">{{ text }} </div>
                                            </a-tooltip>
                                        </div>
                                    </template>
                                    <template v-if="column.dataIndex === 'questionDescription'">
                                        <div class="question-div">
                                            <a-tooltip
                                                :overlay-style="overStyle"
                                                v-if="record.questionDescription"
                                                placement="right"
                                            >
                                                <template #title>
                                                    <p
                                                        v-for="(item, index) in handlerGetSpace(
                                                            record.questionDescription
                                                        )"
                                                        :key="index"
                                                        style="margin: 0"
                                                        >{{ item }}</p
                                                    > </template
                                                ><div class="omit-div-question"
                                                    ><span v-if="record.questionDescription">{{ text }}</span></div
                                                >
                                            </a-tooltip>
                                        </div>
                                    </template>
                                    <template v-if="column.dataIndex === 'projectProgressStatus'">
                                        <div class="question-div">
                                            <a-tooltip
                                                :overlay-style="overStyle"
                                                v-if="record.projectProgressStatus"
                                                placement="right"
                                            >
                                                <template #title>
                                                    <p
                                                        v-for="(item, index) in handlerGetSpace(
                                                            record.projectProgressStatus
                                                        )"
                                                        :key="index"
                                                        style="margin: 0"
                                                        >{{ item }}</p
                                                    > </template
                                                ><div class="omit-div-status"
                                                    ><span v-if="record.projectProgressStatus">{{ text }}</span></div
                                                >
                                            </a-tooltip>
                                        </div>
                                    </template>
                                    <template v-if="column.dataIndex === 'workOrderNumber'">
                                        <a-tooltip :overlay-style="overStyle">
                                            <template #title>
                                                <p
                                                    v-for="(item, index) in handlerGetSpace(record.workOrderNumber)"
                                                    :key="index"
                                                    style="margin: 0"
                                                    >{{ item }}</p
                                                >
                                            </template>
                                            <div style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap"
                                                ><a
                                                    href="#"
                                                    @click="jumpGd(record)"
                                                    style="color: #3875ff; text-decoration: underline"
                                                    >{{ text }}</a
                                                ></div
                                            >
                                        </a-tooltip>
                                    </template>
                                    <template v-if="column.dataIndex === 'completionStatusFeedback'">
                                        <div class="productionPlan-div">
                                            <a-tooltip
                                                :overlay-style="overStyle"
                                                v-if="record.completionStatusFeedback"
                                                placement="right"
                                            >
                                                <template #title>
                                                    <p
                                                        v-for="(item, index) in handlerGetSpace(text)"
                                                        :key="index"
                                                        style="margin: 0"
                                                        >{{ item }}</p
                                                    > </template
                                                ><div class="omit-div-productionPlan" v-if="text">{{ text }}</div>
                                            </a-tooltip>
                                        </div>
                                    </template>
                                </template>
                                <template v-if="column.dataIndex === 'count'">
                                    {{ index + 1 }}
                                </template>
                                <template v-if="column.dataIndex === 'responsiblePerson'">
                                    {{ record.responsiblePersonList?.join(',') }}
                                </template>
                                <!--                                转Faq状态-->
                                <template v-if="column.dataIndex === 'zfaq'">
                                    {{ record.faqMilepost ? '已转FAQ' : '未转FAQ' }}
                                </template>
                                <!--                                转Faq状态-->
                                <!--                                转工单状态-->
                                <template v-if="column.dataIndex === 'workOrderStatus'">
                                    <div class="status-div" :style="{ backgroundColor: getTextColor(text) }">{{
                                        text
                                    }}</div>
                                </template>
                                <!--                                转状态-->
                                <!--                                会议来源-->

                                <!--                                会议来源-->
                            </template>
                        </a-table>
                    </div>
                </div>
            </div>

            <!-- end vid_486bv26odh 自定义模板_vnu1izs281 -->
        </a-spin>
    </div>
</template>
<script setup lang="tsx">
    import {
        h,
        ref,
        reactive,
        toRaw,
        markRaw,
        watch,
        computed,
        onBeforeMount,
        onMounted,
        onBeforeUnmount,
        onUnmounted,
        onActivated,
        onDeactivated
    } from 'vue'
    import { useRoute, useRouter } from 'vue-router'
    const router = useRouter()
    const route = useRoute()
    import { get, post, put, del, request, requestWithHeaders } from '@/utils/http/Axios'
    import {
        cloneDeep,
        localGet,
        merge,
        getDifferenceArray,
        traversalTreeStructure,
        checkCaseCondition,
        renderStringInTemplate,
        handleBreadcrumbJump,
        throttle,
        permission,
        getComponentParamsValue
    } from '@/utils/index'
    import { isNullOrEmpty, isEmptyArr, isNullOrUnDef, isContained, isArray, isEmpty, isObject } from '@/utils/is'
    import dayjs from 'dayjs'
    import { getPagePcChartsDataSourceConvert } from '@/utils/chart'
    import { message, notification, Modal } from 'ant-design-vue'
    import {
        propertyFormatByNumber,
        propertyFormatByPercentage,
        propertyFormatByDate,
        parseSubFromDataList
    } from '@/utils/format'
    import colorTheme from '@/design/custom-theme.json'
    /*** PUBLISH_EXEGESIS ***
 import UserTableRecords from '@/model/UserTableRecords';
 import { getAppBaseUrl } from '@/utils/index';
 import { sendToken } from "@/hooks/useIframeToken";
 import { useSystemStore } from "@/store/modules/system";
 const systemStore = useSystemStore();
 *** PUBLISH_EXEGESIS ***/

    // 获取传入的流程ID和组件参数
    const props = defineProps({
        'processInstanceId': {
            type: [String, Number, Boolean],
            default: undefined
        }
    })
    const immediateWatch = (source, callback) => {
        watch(source, callback, { deep: true, immediate: true })
    }

    /* -------------------------- 属性定义 -------------------------- */

    const setTimeOutList = []
    const pageLoading = reactive({
        loading: false,
        tip: undefined
    })
    const authInfo = localGet('app-user-store')

    // 处理校验
    const setSubFormName = (parentInfo, name) => {
        return [parentInfo.parents, parentInfo.cycleIndex, name]
    }

    /* ========================== 属性定义 ========================== */

    /* -------------------------- 元素数据引用 -------------------------- */

    /* ========================== 元素数据引用 ========================== */

    /* -------------------------- 页面数据 -------------------------- */

    /* ========================== 页面数据 ========================== */

    /* -------------------------- 响应 -------------------------- */

    /* ========================== 响应 ========================== */

    /* -------------------------- 函数 -------------------------- */

    /* ========================== 函数 ========================== */

    /* -------------------------- 页面参数 -------------------------- */

    const pageParameter_state = reactive({
        'processInstanceId': props.processInstanceId ?? route.query.processInstanceId
    })

    /* ========================== 页面参数 ========================== */

    /* -------------------------- 组件事件处理方法 -------------------------- */

    // ---------------------------- 组件数据同步 ----------------------------

    // ============================ 组件数据同步 ============================

    /* ========================== 组件事件处理方法 ========================== */

    /* -------------------------- 生命周期 -------------------------- */
    // 用于参数变更后重新执行自定义指令
    const queryUpdateFlag = ref(0)
    onMounted(() => {})

    onUnmounted(() => {
        // 销毁定时器
        setTimeOutList.forEach(({ repeat, timer }) => {
            repeat ? clearInterval(timer) : clearTimeout(timer)
        })
    })

    /* ========================== 生命周期 ========================== */

    /* -------------------------- 数据关联处理 -------------------------- */

    /* -------------------------- 表单数据同步 -------------------------- */
    /* ========================== 表单数据同步 ========================== */

    /* ========================== 数据关联处理 ========================== */

    /* -------------------------- 不同组件自定义的处理逻辑 -------------------------- */

    /* ========================== 不同组件自定义的处理逻辑 ========================== */

    // ================================定制化逻辑========================================
    import { nextTick } from 'vue'
    let getPopupContainer
    onMounted(async () => {
        getAreaList()
        getGdAreaList()
        getBaseList()
        getData()
        getLhwtAllUser()
        getPermission()
        getFxLx()
        getHyly()
        getWtly()
        get('/config.json').then(data => {
            lhwtState.templateUrl = data.meeting_question_excel_template_url
        })
    })

    const radioStyle = reactive({
        display: 'flex',
        height: '30px',
        lineHeight: '30px'
    })

    const currentLhwtData = ref({})
    const customCellStyle = () => {
        return {
            style: {
                padding: '0 5px'
            }
        }
    }
    const customOkCellStyle = () => {
        return {
            style: {
                padding: '4px 16px'
            }
        }
    }
    // 获取数据
    function getData() {
        lhwtState.tableLoading = true
        post('/solution-ppm/api/v2/built-in-system-ppm/meeting_question/search_by_page ', {
            ...lhwtState.filter,
            pageSize: pagination.value.pageSize,
            pageNo: pagination.value.current
        })
            .then(data => {
                if (data.code !== 200) {
                    lhwtState.dataSource = []
                    message.error(data.message)
                    return
                }

                lhwtState.dataSource = data.data.dataList.map(item => {
                    return {
                        ...item,
                        responsiblePersonList: item.responsiblePersonList || []
                    }
                })
                pagination.value.total = data.data.totalElements
            })
            .finally(() => {
                lhwtState.tableLoading = false
            })
    }
    // 导出
    function resetData() {
        lhwtState.filter = {
            areaCode: undefined,
            riskType: undefined,
            projectDirector: undefined,
            pmName: undefined,
            questionTypeSecond: undefined,
            solution: undefined,
            faq: undefined,
            systemClosedLoop: undefined,
            workOrderStatus: ''
        }
        pagination.value.current = 1
        pagination.value.pageSize = 100
        getData()
    }
    const overStyle = ref({
        maxWidth: '500px',
        fontSize: '16px'
    })
    const currentData = ref({})
    const columnState = reactive({
        baseColumns: [
            {
                title: '序号',
                dataIndex: 'count',
                align: 'center',
                width: 80,
                fixed: 'left',
                ellipsis: true
            },

            {
                title: '记录日期',
                dataIndex: 'meetingDate',
                align: 'center',
                width: 150,
                fixed: 'left',
                ellipsis: true,
                visible: true,
                customHeaderCell: customCellStyle
            },
            {
                title: '状态',
                dataIndex: 'workOrderStatus',
                align: 'center',
                ellipsis: true,
                width: 150,
                customHeaderCell: customOkCellStyle
            },
            {
                title: '工单编号',
                dataIndex: 'workOrderNumber',
                align: 'center',
                ellipsis: true,

                width: 120
            },
            {
                title: '会议来源',
                dataIndex: 'meetingSources',
                align: 'center',
                ellipsis: true,

                width: 200
            },
            {
                title: '问题&风险描述',
                dataIndex: 'questionDescription',
                ellipsis: true,
                align: 'center',
                resizable: true,
                width: 350,
                minWidth: 350,
                visible: true,
                customHeaderCell: customCellStyle
            },
            {
                title: '解决方案及行动项',
                dataIndex: 'solutionOrAction',
                ellipsis: true,
                align: 'center',
                resizable: true,
                width: 350,
                minWidth: 350,
                visible: true,
                customHeaderCell: customCellStyle
            },
            {
                title: '责任人',
                dataIndex: 'responsiblePerson',
                align: 'center',
                ellipsis: true,
                visible: true,
                width: 150,
                customHeaderCell: customOkCellStyle
            },
            {
                title: '计划完成日期',
                dataIndex: 'endTime',
                align: 'center',
                ellipsis: true,
                width: 150,
                visible: true,
                customHeaderCell: customOkCellStyle
            },

            {
                title: '风险类型',
                dataIndex: 'riskType',
                align: 'center',
                width: 150,
                ellipsis: true,
                visible: true,
                customHeaderCell: customCellStyle
            },
            {
                title: '项目类型',
                dataIndex: 'projectType',
                align: 'center',
                width: 150,
                ellipsis: true,
                visible: true,
                customHeaderCell: customCellStyle
            },
            {
                title: '完成情况反馈',
                dataIndex: 'completionStatusFeedback',
                ellipsis: true,
                align: 'center',
                resizable: true,
                width: 350,
                minWidth: 350,
                visible: true,
                customHeaderCell: customCellStyle
            },

            {
                'title': '区域',
                'dataIndex': 'areaName',
                ellipsis: true,
                align: 'center',
                width: 150,
                visible: true,
                customHeaderCell: customCellStyle
            },
            {
                title: '项目/工厂名称',
                dataIndex: 'projectShortName',
                ellipsis: true,
                width: 200,
                align: 'center',
                visible: true,
                customHeaderCell: customCellStyle
            },
            {
                title: '项目总监',
                dataIndex: 'projectDirector',
                ellipsis: true,
                align: 'center',
                visible: true,
                width: 120,
                customHeaderCell: customCellStyle
            },
            {
                title: '项目经理',
                dataIndex: 'pmName',
                align: 'center',
                ellipsis: true,
                visible: true,
                width: 120,
                customHeaderCell: customOkCellStyle
            },
            {
                title: 'PMO',
                dataIndex: 'pmo',
                align: 'center',
                ellipsis: true,
                visible: true,
                width: 120,
                customHeaderCell: customOkCellStyle
            },
            {
                title: '问题类型',
                dataIndex: 'questionTypeFirst',
                align: 'center',
                ellipsis: true,

                width: 150
            },
            {
                title: '问题二级分类',
                dataIndex: 'questionTypeSecond',
                align: 'center',
                ellipsis: true,

                width: 120
            },
            {
                title: '解决方案',
                dataIndex: 'solution',
                align: 'center',
                ellipsis: true,

                width: 120
            },
            {
                title: 'FAQ',
                dataIndex: 'faqMilepost',
                align: 'center',
                ellipsis: true,

                width: 120
            },
            {
                title: '是否共性问题',
                dataIndex: 'commonProblems',
                align: 'center',
                ellipsis: true,

                width: 120
            },
            {
                title: '体系闭环',
                dataIndex: 'systemClosedLoop',
                resizable: true,
                align: 'center',
                ellipsis: true,

                width: 120
            },
            {
                title: '项目进展状态',
                dataIndex: 'projectProgressStatus',
                align: 'center',
                resizable: true,
                ellipsis: true,

                width: 160
            },

            {
                title: '转FAQ状态',
                dataIndex: 'zfaq',
                align: 'center',
                ellipsis: true,

                width: 150,
                customHeaderCell: customOkCellStyle
            },

            // {
            //     title: '创建人',
            //     dataIndex: 'createdBy',
            //     align: 'center',
            //     ellipsis: true,
            //     width: 120
            // },
            // {
            //     title: '创建时间',
            //     dataIndex: 'createdTime',
            //     align: 'center',
            //     ellipsis: true,
            //     width: 150
            // },
            {
                title: '操作',
                dataIndex: 'opration',
                resizable: true,
                visible: true,
                align: 'center',
                fixed: 'right',
                width: 330
            }

            // 其他通用列
        ],
        oldColumns: []
    })
    const tableRef = ref(null)
    const handleResizeColumn = (w, col) => {
        const width = w - 50 // 确保宽度被计算并且减去额外空间

        // 根据列标题来确定不同的 div
        let div = null
        if (col.title === '解决方案及行动项') {
            div = document.querySelectorAll('.omit-div')
        } else if (col.title.includes('问题&风险描述')) {
            div = document.querySelectorAll('.omit-div-question')
        } else if (col.title === '项目进展状态') {
            div = document.querySelectorAll('.omit-div-status')
        }

        // 如果找到了对应的 div，更新其宽度
        if (div.length > 0) {
            div.forEach(item => {
                item.style.width = `${width}px`
            })
            overStyle.value.maxWidth = `${width}px` // 更新 tooltip 最大宽度
        }

        // 更新 columnState 中的列宽
        columnState.baseColumns = columnState.baseColumns.map(item => {
            if (item.dataIndex === col.dataIndex) {
                return { ...item, width: w } // 更新该列的宽度
            }
            return item
        })

        // 如果列有子列，确保子列也能根据父列的宽度进行更新
        if (col.children) {
            col.children.forEach(child => {
                columnState.baseColumns = columnState.baseColumns.map(item => {
                    if (item.dataIndex === child.dataIndex) {
                        return { ...item, width: w } // 更新子列的宽度
                    }
                    return item
                })
            })
        }
    }

    function getLhwtAllUser() {
        get('/solution-ppm/api/v2/built-in-system-ppm/pmgf/get/allUser').then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            lhwtState.allUser = data.data.userDtoList
        })
    }
    async function getBaseList() {
        // 定义请求接口的 URL 或方法
        const requests = [
            get('/solution-ppm/api/v2/built-in-system-ppm/dictionary/search_tree/LHWTKB.WTLX'), // 问题类型
            get('/solution-ppm/api/v2/built-in-system-ppm/dictionary/search/LHWTKB.JJFA'), // 解决方案
            get('/solution-ppm/api/v2/built-in-system-ppm/dictionary/search/LHWTKB.FAQ'), // faq
            get('/solution-ppm/api/v2/built-in-system-ppm/dictionary/search/LHWTKB.TXBH'), // 体系闭环
            get('/solution-ppm/api/v2/built-in-system-ppm/dictionary/search/LHWTKB.GDZT') // 完成状态
        ]

        try {
            // 使用 Promise.allSettled 确保所有请求都会执行
            const results = await Promise.allSettled(requests)

            // 处理每个请求的结果
            results.forEach((result, index) => {
                if (result.status === 'fulfilled') {
                    if (index === 0) {
                        lhwtState.wtlxList = result.value.data
                    } else if (index === 1) {
                        lhwtState.jjfaList = result.value.data.map(item => {
                            return {
                                label: item.itemName,
                                value: item.itemName
                            }
                        })
                    } else if (index === 2) {
                        lhwtState.faqList = result.value.data.map(item => {
                            return {
                                label: item.itemName,
                                value: item.itemName
                            }
                        })
                    } else if (index === 3) {
                        lhwtState.txbhList = result.value.data.map(item => {
                            return {
                                label: item.itemName,
                                value: item.itemName
                            }
                        })
                    } else if (index === 4) {
                        lhwtState.finishStatusList = result.value.data.map(item => {
                            return {
                                label: item.itemName,
                                value: item.itemName
                            }
                        })
                    }
                } else {
                    // 请求失败，打印错误
                    console.error(`接口 ${index + 1} 请求失败:`, result.reason)
                }
            })
        } catch (error) {
            // 捕获任何其他的错误（比如请求数组外的错误）
            console.error('请求出现意外错误:', error)
        }
    }
    // 问题新建
    const lhwtState = reactive({
        changeForm: {
            meetingDate: dayjs().format('YYYY-MM-DD'),
            areaCode: undefined,
            solution: undefined,
            projectId: undefined,
            projectDirector: undefined,
            pmName: undefined,
            questionDescription: undefined,
            responsiblePersonList: undefined,
            endTime: undefined,
            completionStatusFeedback: undefined,
            questionTypeFirst: undefined,
            questionTypeSecond: undefined,
            faq: undefined,
            commonProblems: undefined,
            systemClosedLoop: undefined,
            finishStatus: '未启动',
            projectType: undefined,
            solutionOrAction: undefined
        },
        templateUrl: undefined,
        addOrEditVisible: false,
        permission: false,
        validateVisible: false,
        tipLoading: false,
        modalTitle: '新建问题',
        filter: {
            areaCode: undefined,
            projectDirector: undefined,
            pmName: undefined,
            questionTypeSecond: undefined,
            solution: undefined,
            faq: undefined,
            systemClosedLoop: undefined,
            finishStatus: ''
        },
        wtlxList: [],
        fxlxList: [],
        finishStatusList: [],
        jjfaList: [],
        faqList: [],
        txbhList: [],
        finishStatusList: [],
        areaNameList: [],
        projectList: [],
        hylyList: [],
        projectNameList: [],
        projectDirectorList: [],
        pmNameList: [],
        allUser: [],
        dataSource: [],
        tableLoading: false,
        inportFileList: [],
        importVisible: false,
        importLoading: false,
        exportLoading: false
    })
    const lhwtRef = ref(null)

    const editData = ref({})
    function confirmLhwt(record) {
        console.log(record)
        editData.value = record

        finallyConfirmLhwt(record)
    }
    function noSaveData() {
        message.info('已取消编辑！')
        lhwtState.validateVisible = false
        getData()
    }
    // function finallyConfirmLhwt(record) {
    //     record.okBtnLoading = true
    //     lhwtState.tipLoading = true
    //     const api = editData.value.isNew ? post : put
    //     api('/solution-ppm/api/v2/built-in-system-ppm/meeting_question', editData.value)
    //         .then(data => {
    //             if (data.code !== 200) {
    //                 message.error(data.message)
    //                 return
    //             }
    //             message.success(data.message)
    //             record.isEdit = false
    //             lhwtState.validateVisible = false
    //             if (record.areaCode) {
    //                 record.areaName = lhwtState.areaNameList.find(item => item.value === record.areaCode).label
    //             }
    //
    //             if (record.projectId) {
    //                 let projectList = []
    //                 get(
    //                     `/solution-ppm/api/v2/built-in-system-ppm/meeting_question/get_project_by_area_code/${record.areaCode}`
    //                 ).then(data => {
    //                     projectList = data.data.map(item => {
    //                         return {
    //                             label: item.projectShortName,
    //                             value: item.projectId,
    //                             pmName: item.pmName,
    //                             projectDirector: item.projectDirector,
    //                             pmo: item.projectManagementOffice
    //                         }
    //                     })
    //                     console.log(projectList)
    //                     record.projectShortName = projectList.find(item => item.value === record.projectId).label
    //                 })
    //             }
    //         })
    //         .finally(() => {
    //             editData.value = {}
    //             record.okBtnLoading = false
    //             lhwtState.tipLoading = false
    //         })
    // }
    function finallyConfirmLhwt(record) {
        record.okBtnLoading = true
        lhwtState.tipLoading = true
        const api = editData.value.isNew ? post : put

        api('/solution-ppm/api/v2/built-in-system-ppm/meeting_question', editData.value)
            .then(data => {
                if (data.code !== 200) {
                    message.error(data.message)
                    return
                }
                message.success(data.message)

                if (editData.value.isNew) {
                    // 新建数据的情况
                    const index = lhwtState.dataSource.findIndex(item => item === record)
                    if (index !== -1) {
                        // 用后端返回的数据替换临时数据
                        lhwtState.dataSource.splice(index, 1, {
                            ...data.data,
                            isEdit: false
                        })
                    }
                } else {
                    // 编辑现有数据的情况
                    Object.assign(record, data.data, { isEdit: false })
                }
                // if (record.projectId) {
                //     let projectList = []
                //     get(
                //         `/solution-ppm/api/v2/built-in-system-ppm/meeting_question/get_project_by_area_code/${record.areaCode}`
                //     ).then(data => {
                //         projectList = data.data.map(item => {
                //             return {
                //                 label: item.projectShortName,
                //                 value: item.projectId,
                //                 pmName: item.pmName,
                //                 projectDirector: item.projectDirector,
                //                 pmo: item.projectManagementOffice
                //             }
                //         })
                //         console.log(projectList)
                //         record.projectShortName = projectList.find(item => item.value === record.projectId).label
                //     })
                // }
                lhwtState.validateVisible = false
            })
            .finally(() => {
                editData.value = {}
                record.okBtnLoading = false
                lhwtState.tipLoading = false
            })
    }
    function handleEdit(record) {
        record.editLoading = true
        put(`/solution-ppm/api/v2/built-in-system-ppm/meeting_question/modify_lock/${record.id} `)
            .then(async data => {
                if (data.code !== 200) {
                    message.error('有人正在操作')
                    return
                }
                await getFactory(record)
                await getProjectNameList(record)
                record.isEdit = true
            })
            .finally(() => {
                record.editLoading = false
            })
    }

    function handleAddTable() {
        lhwtState.dataSource.unshift({ ...lhwtState.changeForm, isNew: true, isEdit: true })
    }
    function cancelLhwt() {
        lhwtState.changeForm = {
            meetingDate: dayjs().format('YYYY-MM-DD'),
            areaCode: undefined,
            solution: undefined,
            projectId: undefined,
            projectDirector: undefined,
            pmName: undefined,
            questionDescription: undefined,
            responsiblePersonList: undefined,
            endTime: undefined,
            completionStatusFeedback: undefined,
            questionTypeFirst: undefined,
            questionTypeSecond: undefined,
            faq: undefined,
            commonProblems: undefined,
            systemClosedLoop: undefined,
            solutionOrAction: undefined,
            projectType: undefined,
            finishStatus: undefined
        }
        currentLhwtData.value = {}
        lhwtState.addOrEditVisible = false
    }
    function changeLhwt(record) {
        if (!lhwtState.permission) {
            message.info('暂无权限')
            return
        }
        currentLhwtData.value = record
        lhwtState.modalTitle = '编辑问题'
        let data = cloneDeep(record)
        Object.assign(lhwtState.changeForm, data)
        lhwtState.addOrEditVisible = true
    }
    function confirmDeleteLhwt(record, id) {
        if (!lhwtState.permission) {
            message.info('暂无权限')
            return
        }
        if (record.isNew) {
            lhwtState.dataSource.shift()
        } else {
            del(`/solution-ppm/api/v2/built-in-system-ppm/meeting_question/${id}`).then(data => {
                if (data.code !== 200) {
                    message.error(data.message)
                    return
                }
                message.success(data.message)
                getData()
            })
        }
    }
    // 区域
    function getAreaList() {
        get('/solution-ppm/api/v2/built-in-system-ppm/work_order/area_info').then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            lhwtState.areaNameList = data.data.map(item => {
                return {
                    label: item.areaName,
                    value: item.areaCode
                }
            })
            lhwtState.areaNameList.unshift({ label: '全部', value: '全部' })
        })
    }
    // 工单区域
    // 区域
    function getGdAreaList() {
        get('/solution-ppm/api/v2/built-in-system-ppm/work_order/area_info').then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            gdState.areaList = data.data.map(item => {
                return {
                    label: item.areaName,
                    value: item.areaCode
                }
            })
        })
    }

    function getProjectNameList() {
        get(`/solution-ppm/api/v2/built-in-system-ppm/meeting_question/get_platform_project`).then(data => {
            lhwtState.projectNameList = data.data.map(item => {
                return {
                    label: item.projectName,
                    value: item.id
                }
            })
        })
    }
    function getFactory(record) {
        get(
            `/solution-ppm/api/v2/built-in-system-ppm/meeting_question/get_project_by_area_code/${record.areaCode}`
        ).then(data => {
            lhwtState.projectList = data.data.map(item => {
                return {
                    label: item.projectShortName,
                    value: item.projectId,
                    pmName: item.pmName,
                    projectDirector: item.projectDirector,
                    pmo: item.projectManagementOffice
                }
            })
        })
    }
    function factoryChange(record) {
        let chooseData = lhwtState.projectList.find(item => item.value === record.projectId)
        if (chooseData) {
            if (record) {
                record.projectDirector = chooseData.projectDirector?.split(',')[0]
                record.pmName = chooseData.pmName
                record.pmo = chooseData.pmo
            } else {
                lhwtState.changeForm.projectDirector = chooseData.projectDirector?.split(',')[0]
                lhwtState.changeForm.pmName = chooseData.pmName
                lhwtState.changeForm.pmo = chooseData.pmo
            }
        }
    }
    function areaChange(record) {
        if (record) {
            record.pmName = record.projectDirector = record.projectId = undefined
        } else {
            lhwtState.changeForm.pmName =
                lhwtState.changeForm.projectDirector =
                lhwtState.changeForm.projectId =
                    undefined
        }
    }
    function getPermission() {
        get('/solution-ppm/api/v2/built-in-system-ppm/meeting_question/permission').then(data => {
            lhwtState.permission = data.data
        })
    }
    //     转化为工单
    import { QuillEditor, Quill } from '@vueup/vue-quill'
    import ImageUploader from 'quill-image-uploader'
    import '@vueup/vue-quill/dist/vue-quill.snow.css'
    const titleConfig = [
        { Choice: ' .ql-bold', title: '加粗' },
        { Choice: ' .ql-italic', title: '斜体' },
        { Choice: ' .ql-underline', title: '下划线' },
        { Choice: ' .ql-strike', title: '删除线' },
        { Choice: ' .ql-blockquote', title: '块引用' },
        { Choice: ' .ql-code-block', title: '插入代码' },
        { Choice: ' .ql-size', title: '字体大小' },
        { Choice: ' .ql-size', title: '字体大小' },
        { Choice: ' .ql-color', title: '字体颜色' },
        { Choice: ' .ql-background', title: '字体背景颜色' },
        { Choice: ' .ql-list[value="ordered"]', title: '有序列表' },
        { Choice: ' .ql-list[value="bullet"]', title: '无序列表' },
        { Choice: ' .ql-header[value="1"]', title: '1级标题' },
        { Choice: ' .ql-header[value="2"]', title: '2级标题' },
        { Choice: ' .ql-align', title: '对齐方式' },
        { Choice: ' .ql-clean', title: '清除字体格式' },
        { Choice: ' .ql-image', title: '图像' },
        { Choice: ' .ql-size .ql-picker-item[data-value="small"]', title: '小号' },
        { Choice: ' .ql-size .ql-picker-item[data-value="large"]', title: '大号' },
        { Choice: ' .ql-size .ql-picker-item[data-value="huge"]', title: '超大号' },
        { Choice: ' .ql-size .ql-picker-item:nth-child(2)', title: '标准' },
        { Choice: ' .ql-align .ql-picker-item:first-child', title: '居左对齐' },
        { Choice: ' .ql-align .ql-picker-item[data-value="center"]', title: '居中对齐' },
        { Choice: ' .ql-align .ql-picker-item[data-value="right"]', title: '居右对齐' },
        { Choice: ' .ql-align .ql-picker-item[data-value="justify"]', title: '两端对齐' }
    ]
    // 注册图片上传模块
    Quill.register('modules/imageUploader', ImageUploader)

    // 将本地文件转换为URL
    const getLocalImageURL = file => {
        return new Promise(resolve => {
            const reader = new FileReader()
            reader.onload = e => {
                resolve(e.target.result)
            }
            reader.readAsDataURL(file)
        })
    }

    // 表单数据

    // Quill 编辑器选项
    const editorOption = ref({
        modules: {
            toolbar: [
                ['bold', 'italic', 'underline', 'strike'], // 加粗，斜体，下划线，删除线
                ['blockquote', 'code-block'], // 引用，代码块
                [{ header: 1 }, { header: 2 }], // 标题1，标题2
                [{ list: 'ordered' }, { list: 'bullet' }], // 有序列表，无序列表
                [{ size: ['small', false, 'large', 'huge'] }], // 文字大小
                [{ color: [] }, { background: [] }], // 字体颜色，背景颜色
                [{ align: [] }], // 对齐
                ['clean'], // 清除格式
                ['image'] // 链接，图片，视频
            ]
            // ImageUploader: imageHandler
        }
    })

    // 将 dataURL 转换为 File 对象的辅助函数
    const dataURLtoFile = (dataurl, filename) => {
        const arr = dataurl.split(',')
        const mime = arr[0].match(/:(.*?);/)[1]
        const bstr = atob(arr[1])
        let n = bstr.length
        const u8arr = new Uint8Array(n)
        while (n--) {
            u8arr[n] = bstr.charCodeAt(n)
        }
        return new File([u8arr], filename, { type: mime })
    }
    const gdState = reactive({
        visible: false,
        fatherLoading: false,
        modalForm: {
            content: undefined,
            type: '问题转化',
            priority: undefined,
            questionSource: '问题转化',
            workHours: undefined,
            endTime: undefined,
            areaCode: undefined,
            projectId: undefined,
            version: undefined,
            customer: undefined,
            production: undefined,
            environment: undefined,
            description: undefined,
            monitorScene: undefined,
            solverList: [],
            descriptionAttachmentList: [],
            qillData: ''
        },
        projectList: [],
        wtlyList: [],
        customList: [],
        productList: [],
        areaList: [],
        environmentList: [],
        monitorSceneList: []
    })
    // 获取问题来源
    function getWtly() {
        get('/solution-ppm/api/v2/built-in-system-ppm/dictionary/search/GD.WTLY').then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            gdState.wtlyList = data.data.map(item => {
                return {
                    label: item.itemName,
                    value: item.itemName
                }
            })
        })
    }
    const quillEditor = ref(null) // 引用QuillEditor组件
    const answerQuillEditor = ref(null) // 引用QuillEditor组件
    async function showGd(record) {
        convertId.value = record.id
        await getProjectList() // 获取项目列表
        await getEnvironmentList() // 获取环境列表
        await getCustomerList() // 获取客户列表
        await getProductList() // 获取产品列表
        gdState.visible = true
        nextTick(() => {
            initTitle()
            const data = cloneDeep(record)
            console.log(data, 'data')
            gdState.modalForm.areaCode = data.areaCode
            gdState.modalForm.content = data.questionDescription
            if (data.endTime) {
                gdState.modalForm.endTime = dayjs(data.endTime).format('YYYY-MM-DD HH:mm:ss')
            }
            gdState.modalForm.projectId = data.projectId
            quillEditor.value.setText(data.questionDescription + data.solutionOrAction)
        })
    }
    function initTitle() {
        document.getElementsByClassName('ql-editor')[0].dataset.placeholder = ''
        for (let item of titleConfig) {
            let tip = document.querySelector('.ql-toolbar' + item.Choice)
            if (!tip) continue
            tip.setAttribute('title', item.title)
        }
    }
    const gdFormRef = ref(null)
    // 上传API
    const uploadFileAPI = async file => {
        const data = new FormData()
        data.append('file', file)

        return post('/file-storage/api/v1/file/upload', data)
            .then(({ data: { fullUrl } }) => {
                return { data: { fullUrl } }
            })
            .catch(error => {
                console.error('上传图片出错:', error)
                throw error // 抛出错误以供外部处理
            })
    }
    const convertId = ref()
    //     父工单提交表单
    function submit() {
        gdFormRef.value.validate().then(async () => {
            gdState.fatherLoading = true
            const deltaContent = quillEditor.value.getContents()

            const imageUploadPromises = []

            deltaContent.ops.forEach(op => {
                if (op.insert && op.insert.image && op.insert.image.startsWith('data:')) {
                    const localSrc = op.insert.image

                    // 如果是 base64 图片，上传并替换为 URL
                    const file = dataURLtoFile(localSrc, 'image.png') // 将 base64 转换为 File 对象

                    const uploadPromise = uploadFileAPI(file).then(({ data: { fullUrl } }) => {
                        // 替换 op 中的 base64 URL 为服务器返回的 URL
                        op.insert.image = fullUrl
                    })

                    imageUploadPromises.push(uploadPromise)
                }
            })
            try {
                await Promise.all(imageUploadPromises)
                // 新建保存逻辑
                const params = { ...gdState.modalForm }
                params.description = JSON.stringify(deltaContent)
                post(
                    `/solution-ppm/api/v2/built-in-system-ppm/meeting_question/transfer_to_work_order/${convertId.value}`,
                    params
                )
                    .then(data => {
                        if (data.code !== 200) {
                            message.error(data.message)
                            return
                        }
                        message.success(data.message)
                        gdState.visible = false
                        resetFather()
                        getData()
                    })
                    .finally(() => {
                        gdState.fatherLoading = false
                    })
            } catch (error) {
                gdState.fatherLoading = false
                console.error('图片上传失败', error)
                return // 终止提交
            }
        })
    }
    function resetFather() {
        gdState.modalForm = {
            content: undefined,
            type: '问题转化',
            priority: undefined,
            questionSource: '问题转化',
            workHours: undefined,
            endTime: undefined,
            areaCode: undefined,
            projectId: undefined,
            version: undefined,
            customer: undefined,
            production: undefined,
            environment: undefined,
            description: undefined,
            solverList: [],
            descriptionAttachmentList: [],
            qillData: ''
        }
    }
    function fatherCancel() {
        gdState.visible = false
        resetFather()
    }
    function hanldeTypeChange() {
        if (gdState.modalForm.type === '产品需求') {
            gdState.modalForm.priority = 'p3'
            getSolveTimeByType('p3')
        } else {
            gdState.modalForm.priority = gdState.modalForm.endTime = gdState.modalForm.workHours = undefined
        }
    }
    //     根据类型获取解决时间
    function getSolveTimeByType(type) {
        let num = 0
        if (type == 'p0') {
            num = 2
            gdState.modalForm.workHours = 2
        } else if (type == 'p1') {
            num = 24
            gdState.modalForm.workHours = 24
        } else if (type == 'p2') {
            num = 48
            gdState.modalForm.workHours = 48
        } else if (type == 'p3') {
            num = 48
            gdState.modalForm.workHours = 336
        }
        getSolveTime()
    }
    //     计算解决时间
    function getSolveTime() {
        return
        // 获取当前时间
        let currentDate = dayjs()
        let num = gdState.modalForm.workHours
        // 计算新时间
        let newDate = currentDate.add(num, 'hour')

        // 格式化新时间为 "YYYY-MM-DD HH:mm" 格式
        let formattedDate = newDate.format('YYYY-MM-DD HH:mm:ss')

        gdState.modalForm.endTime = formattedDate
    }
    // 区域变
    function gdAreaChange() {
        gdState.modalForm.customer =
            gdState.modalForm.projectId =
            gdState.modalForm.environment =
            gdState.modalForm.production =
            gdState.modalForm.version =
                undefined
    }
    // 客户改变如果没有选区域自动带区域
    function customerChange() {
        let arae = gdState.customList.find(item => item.name === gdState.modalForm.customer)
        if (arae) {
            gdState.modalForm.areaCode = arae.areaCode
        }
    }
    // 环境变
    function environmentChange() {
        gdState.modalForm.production = gdState.modalForm.version = undefined
    }
    // 项目变
    function projectChange() {
        gdState.modalForm.environment = gdState.modalForm.production = gdState.modalForm.version = undefined
    }
    // 产品变
    function productChange() {
        gdState.modalForm.version = undefined
        getVersionList()
    }
    // 获取版本
    function getVersionList() {
        let envId = gdState.environmentList.find(item => item.name === gdState.modalForm.environment)?.id
        let productId = gdState.productList.find(item => item.name === gdState.modalForm.production)?.id
        get(
            `/solution-ppm/api/v2/built-in-system-ppm/work_order/version?envId=${envId ? envId : ''}&productId=${
                productId ? productId : ''
            }`
        ).then(data => {
            gdState.modalForm.version = data.data
        })
    }
    // 项目
    function getProjectList() {
        if (gdState.modalForm.areaCode) {
            get(
                `/solution-ppm/api/v2//built-in-system-ppm/work_order/project_by_area_code/${gdState.modalForm.areaCode}`
            ).then(data => {
                if (data.code !== 200) {
                    message.error(data.message)
                    return
                }
                gdState.projectList = data.data
            })
        } else {
            get(`/solution-ppm/api/v2//built-in-system-ppm/work_order/project_by_area_code/0`).then(data => {
                if (data.code !== 200) {
                    message.error(data.message)
                    return
                }
                gdState.projectList = data.data
            })
        }
    }
    function getCustomerList() {
        get(
            `/solution-ppm/api/v2/built-in-system-ppm/work_order/customer?areaCode=${
                gdState.modalForm.areaCode ? gdState.modalForm.areaCode : ''
            }`
        ).then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            gdState.customList = data.data
        })
    }
    // 产品
    function getProductList() {
        let envId = gdState.environmentList.find(item => item.name === gdState.modalForm.environment)?.id
        get(`/solution-ppm/api/v2/built-in-system-ppm/work_order/product?envId=${envId ? envId : ''}`).then(data => {
            gdState.productList = data.data
        })
    }
    // 获取环境
    function getEnvironmentList() {
        let customerId = gdState.customList.find(item => item.name === gdState.modalForm.customer)?.id
        get(`/solution-ppm/api/v2/built-in-system-ppm/work_order/env?customerId=${customerId ? customerId : ''}`).then(
            data => {
                gdState.environmentList = data.data
            }
        )
    }
    // 父上传文件
    function handlerFatherUpload(file) {
        gdState.fatherLoading = true
        const data = new FormData()
        data.append('file', file)

        post('/file-storage/api/v1/file/upload', data)
            .then(({ data: { fullUrl } }) => {
                if (data) {
                    // 新文件对象
                    const newFile = {
                        uid: file.uid,
                        lastModified: file.lastModified,
                        name: file.name,
                        size: file.size,
                        type: file.type,
                        status: 'done',
                        url: fullUrl
                    }

                    // 去重，保留一个副本
                    gdState.modalForm.descriptionAttachmentList = [
                        // 保留已存在文件（去除重复）
                        ...gdState.modalForm.descriptionAttachmentList.filter(
                            item => item.uid !== file.uid && item.name !== file.name
                        ),
                        // 添加新的文件
                        newFile
                    ]
                }
                gdState.fatherLoading = false
            })
            .catch(e => {
                message.error('上传失败' + e)
            })

        return false
    }
    // 父移除文件
    function handlerFatherRemove(file) {
        gdState.modalForm.descriptionAttachmentList = gdState.modalForm.descriptionAttachmentList.filter(
            item => item.uid !== file.uid
        )
    }
    // 父上传文件
    //     转化为FAQ
    const faqState = reactive({
        createVisible: false,
        pzLoading: false,
        // 选择问题数据源
        questionList: [],
        createList: {
            'problemName': undefined,
            'scene': undefined,
            'stageNames': undefined,
            'labels': undefined,
            'questionId': undefined,
            'answerStr': undefined
        }
    })
    function showFaq(record) {
        convertId.value = record.id
        getQuestionList()
        faqState.createVisible = true
        faqState.createList.problemName = record.questionDescription
        nextTick(() => {
            nextTick(() => {
                const editor = answerQuillEditor.value
                const content = record.solutionOrAction

                let delta

                // 尝试解析成 JSON
                if (typeof content === 'string') {
                    try {
                        const parsed = JSON.parse(content)
                        // 判断是不是合法的 Delta 格式
                        if (parsed && typeof parsed === 'object' && Array.isArray(parsed.ops)) {
                            delta = parsed
                        }
                    } catch (e) {
                        // 不是 JSON，继续走后面的纯文本逻辑
                    }
                }

                if (delta) {
                    // 是合法 Delta，直接设置
                    editor.setContents(delta)
                } else {
                    // 清空编辑器内容，插入纯文本
                    editor.setText(typeof content === 'string' ? content : String(content || ''))
                }
            })
        })
    }
    function getQuestionList() {
        post('/solution-ppm/api/v2/built-in-system-ppm/qa/question/search', { stageNames: undefined }).then(data => {
            faqState.questionList = data.data.map(item => {
                return {
                    label: item.problemName,
                    value: item.id,
                    stageNames: item.stageNames,
                    labels: item.labels
                }
            })
        })
    }
    const currentQuestion = ref({})
    const questionRef = ref(null)
    function confirmQuestion() {
        questionRef.value.validate().then(async () => {
            faqState.pzLoading = true
            // 富文本
            const deltaContent = answerQuillEditor.value.getContents()

            const imageUploadPromises = []

            deltaContent.ops.forEach(op => {
                if (op.insert && op.insert.image && op.insert.image.startsWith('data:')) {
                    const localSrc = op.insert.image

                    // 如果是 base64 图片，上传并替换为 URL
                    const file = dataURLtoFile(localSrc, 'image.png') // 将 base64 转换为 File 对象

                    const uploadPromise = uploadFileAPI(file).then(({ data: { fullUrl } }) => {
                        // 替换 op 中的 base64 URL 为服务器返回的 URL
                        op.insert.image = fullUrl
                    })

                    imageUploadPromises.push(uploadPromise)
                }
            })
            try {
                await Promise.all(imageUploadPromises)
                const params = cloneDeep(faqState.createList)
                params.answerStr = JSON.stringify(deltaContent)
                debugger
                post(
                    `/solution-ppm/api/v2/built-in-system-ppm/meeting_question/transfer_to_faq/${convertId.value} `,
                    params
                )
                    .then(data => {
                        if (data.code !== 200) {
                            message.error(data.message)
                            return
                        }
                        message.success(data.message)
                        faqState.createVisible = false
                        currentQuestion.value = {}
                        getData()
                        resetAllForm()
                    })
                    .finally(() => {
                        faqState.pzLoading = false
                    })
            } catch (error) {
                console.error('图片上传失败', error)
                return // 终止提交
            }
        })
    }

    function cancalQuestion() {
        faqState.createVisible = false
        resetAllForm()
    }
    function resetAllForm() {
        faqState.createList = {
            'problemName': undefined,
            'scene': undefined,
            'stageNames': undefined,
            'labels': undefined,
            'questionId': undefined,
            'answerStr': undefined
        }
        currentQuestion.value = {}
    }
    function questionChange() {
        if (faqState.createList.questionId) {
            let result = faqState.questionList.find(item => item.value === faqState.createList.questionId)
            console.log(result)
            if (result) {
                faqState.createList.stageNames = result.stageNames
                faqState.createList.labels = result.labels
                faqState.createList.problemName = result.label
            }
        } else {
            faqState.createList.stageNames = ''
            faqState.createList.labels = ''
            faqState.createList.problemName = undefined
        }
    }
    // 转换FAQ
    function projectTypeChange(record) {
        if (record.projectType === '交付项目') {
            record.projectId = undefined
        } else if (record.projectType === '平台项目') {
            record.projectId = undefined
            record.areaCode = undefined
            record.projectDirector = undefined
            record.pmName = undefined
        }
        if (!record.projectType) {
            record.projectId = undefined
            record.areaCode = undefined
            record.projectDirector = undefined
            record.pmName = undefined
        }
    }
    function handlerGetSpace(data) {
        return data ? data.split(/[,，;；\n]/).map(item => item.trim()) : []
    }
    // 上传文件
    function handlerUpload(file) {
        const data = new FormData()
        data.append('file', file)

        post('/file-storage/api/v1/file/upload', data)
            .then(({ data: { fullUrl } }) => {
                if (data) {
                    // 新文件对象
                    const newFile = {
                        uid: file.uid,
                        lastModified: file.lastModified,
                        name: file.name,
                        size: file.size,
                        type: file.type,
                        status: 'done',
                        url: fullUrl,
                        originFileObj: file
                    }

                    // 去重，保留一个副本
                    lhwtState.inportFileList = [
                        // 保留已存在文件（去除重复）
                        ...lhwtState.inportFileList.filter(item => item.uid !== file.uid && item.name !== file.name),
                        // 添加新的文件
                        newFile
                    ]
                }
            })
            .catch(e => {
                message.error('上传失败' + e)
            })

        return false
    }
    // 移除文件
    function handlerRemove(file) {
        lhwtState.inportFileList = lhwtState.inportFileList.filter(item => item.uid !== file.uid)
    }
    function handleImport() {
        const formData = new FormData()

        lhwtState.inportFileList.forEach(file => {
            console.log('上传文件:', file) // 检查文件信息
            formData.append('file', file.originFileObj || file) // 关键：确保传入原始文件对象
        })

        // 🔹 打印 FormData 内容，确保是文件流
        for (let [key, value] of formData.entries()) {
            console.log(key, value, value instanceof File) // 确保 value 是 File 类型
        }

        // **上传请求**
        post('/solution-ppm/api/v2/built-in-system-ppm/meeting_question/import', formData, {
            headers: { 'Content-Type': 'multipart/form-data' } // 确保是文件上传格式
        })
            .then(data => {
                if (data.code !== 200) {
                    message.error(data.message)
                    return
                }
                message.success(data.message)
                getData()
                lhwtState.inportFileList = [] // 清空文件列表
                lhwtState.importVisible = false
            })
            .catch(error => {
                message.error('上传失败，请重试')
                console.error('上传错误:', error)
            })
    }

    function inportCancel() {
        lhwtState.importVisible = false
        lhwtState.inportFileList = []
    }
    function handleExport() {
        lhwtState.exportLoading = true
        post('/solution-ppm/api/v2/built-in-system-ppm/meeting_question/export', lhwtState.filter, {
            responseType: 'arraybuffer'
        }).then(data => {
            downloadExcel(data, '问题数据.xlsx')
            lhwtState.exportLoading = false
        })
    }
    function downloadExcel(response, name) {
        const blob = new Blob([response], {
            type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'
        })
        const downloadElement = document.createElement('a')
        const href = window.URL.createObjectURL(blob) // 创建下载的链接
        downloadElement.href = href
        downloadElement.download = name // 下载后文件名
        document.body.appendChild(downloadElement)
        downloadElement.click() // 点击下载
        document.body.removeChild(downloadElement) // 下载完成移除元素
        window.URL.revokeObjectURL(href)
        return href
    }
    // 获取风险类型
    function getFxLx() {
        get('/solution-ppm/api/v2/built-in-system-ppm/dictionary/search/FXLX').then(data => {
            lhwtState.fxlxList = data.data
        })
    }
    // 获取监控场景list
    function getMonitorSceneList(flag) {
        console.log(flag)
        const params = gdState.modalForm.type
        console.log(params, 'params')
        get(`/solution-ppm/api/v2/built-in-system-ppm/dictionary/search/${params}`).then(data => {
            if (data.code !== 200) {
                message.error(data.message)
                return
            }
            gdState.monitorSceneList = data.data.map(item => {
                return {
                    label: item.itemName,
                    value: item.itemCode
                }
            })
        })
    }
    // 跳工单
    function jumpGd(record) {
        window.open(`${import.meta.env.VITE_PUBLIC_PATH}/page/3000000784?number=${record.workOrderNumber}`, '_blank')
    }
    const colorMap = {
        '解决中': '#3875FF',
        '未转化': '#9254DE',
        '未开始': '#BBBBBB',
        '已解决': '#52C41A',
        '进行中': '#3875ff',
        '延期': '#F5222D',
        '延期解决': '#FF7400',
        '无需解决': '#FFC900',
        '已关闭': '#898989',
        '已回访': '#3FA7FF',
        '待分发': '#FF7D27'
    }
    function getTextColor(text) {
        return colorMap[text] || '#262626'
    }
    const pageSizeChange = (current, size) => {
        console.log('pageSizeChange')
        pagination.value.current = current
        pagination.value.pageSize = size
        getData()
    }
    const pageChange = (page, pageSize) => {
        console.log('pageSizeChange')
        pagination.value.current = page
        pagination.value.pageSize = pageSize
        getData()
    }
    const pagination = ref({
        current: 1,
        pageSize: 100,
        showSizeChanger: true,
        total: 0,
        pageSizeOptions: ['20', '40', '60', '80', '100'],
        showTotal: total =>
            `共 ${total} 个项目 第 ${pagination.value.current}/${Math.ceil(total / pagination.value.pageSize)}页`
    })
    const handleTableChange = (paginationInfo, filters, sorter) => {
        pagination.value.current = paginationInfo.current
        pagination.value.pageSize = paginationInfo.pageSize
        getData()
    }
    // 会议来源
    function getHyly() {
        get('/solution-ppm/api/v2/built-in-system-ppm/dictionary/search/LHWTKB.HYLY').then(data => {
            lhwtState.hylyList = data.data
        })
    }
    //     转任务=========================================================================================================================
    const selectHolder = '请选择'
    const inputHolder = '请输入'
    onMounted(() => {
        getProjectTree()
        const userInfoStorage = localStorage.getItem('al__USER_INFO')
        taskLeader.value = JSON.parse(userInfoStorage)
    })

    const taskPeopleList = ref([])
    function getPopleList() {
        if (!taskState.otherTaskForm.taskList[0].projectId) {
            return
        }
        post(
            `/solution-ppm/api/v2/built-in-system-ppm/task/getTopUser/${taskState.otherTaskForm.taskList[0].projectId}`
        ).then(data => {
            taskPeopleList.value = data.data.map(item => {
                return {
                    label: item,
                    value: item
                }
            })
        })
    }
    const taskLeader = ref({})
    const taskState = reactive({
        storyList: [],
        projectTree: [],
        current: 1,
        otherTaskVisible: false,
        otherTaskTitle: '',
        otherOkLoading: false,
        otherTaskForm: {
            taskList: [
                {
                    taskParticipantList: [],
                    allTile: [],
                    startTime: undefined,
                    endTime: undefined,
                    taskName: undefined,
                    workingHours: undefined,
                    taskOwner: taskLeader.value.name,
                    assessorName: taskLeader.value.name,
                    parentId: undefined,
                    storyId: undefined,
                    sopTaskList: []
                }
            ]
        }
    })
    const useProjectId = ref()
    const currentOtherTask = ref({})
    function handleAddSonTask(record) {
        useProjectId.value = record.projectId
        if (useProjectId.value) {
            let project = taskState.projectTree.find(item => item.projectId === useProjectId.value)
            if (project) {
                project.disabled = true
                taskState.projectTree = [project]
            }
        } else {
            getProjectTree()
        }
        currentOtherTask.value = {}
        taskState.otherTaskVisible = true
        taskState.otherTaskForm = {
            taskList: [
                {
                    taskParticipantList: [],
                    allTile: [],
                    startTime: undefined,
                    endTime: undefined,
                    taskName: undefined,
                    workingHours: undefined,
                    taskOwner: taskLeader.value.name,
                    assessorName: taskLeader.value.name,
                    parentId: undefined,
                    storyId: undefined,
                    taskId: undefined,
                    description: undefined,
                    sopTaskList: []
                }
            ]
        }
        currentOtherTask.value = {}
        taskState.otherTaskTitle = '转任务'
    }
    watch(
        () => taskState.otherTaskForm.taskList.map(item => item.storyId),
        (newList, oldList) => {
            newList.forEach((storyId, index) => {
                // 只有当 storyId 有值并且与旧值不一致时才触发
                if (storyId && storyId !== oldList?.[index]) {
                    taskState.otherTaskForm.taskList[index].parentId = undefined
                    get(`/solution-ppm/api/v2/built-in-system-ppm/v3/platform_task/get_sop_task/${storyId}`).then(
                        data => {
                            taskState.otherTaskForm.taskList[index].sopTaskList = data.data || []
                        }
                    )
                }
            })
        },
        { deep: true, immediate: false }
    )
    const validatePriority = (rule, value) => {
        if (value === undefined || value === null || value === '') {
            return Promise.reject(new Error('请输入优先级'))
        }
        const number = Number(value)
        const isValid = number > 0 && number < 100 && /^(\d{1,2})(\.\d)?$/.test(value.toString())
        return isValid ? Promise.resolve() : Promise.reject(new Error('请输入 1 到 99 之间，最多一位小数的正数'))
    }
    // 获取用户故事
    function getStory() {
        post('/solution-ppm/api/v2/built-in-system-ppm/project/story/search', {
            projectId: taskState.otherTaskForm.taskList[0].projectId
        }).then(data => {
            taskState.storyList = data.data.map(item => {
                return {
                    label: item.storyName,
                    value: item.id
                }
            })
        })
    }
    function disableParentNodes(tree) {
        return tree.map(node => {
            if (node.children && node.children.length > 0) {
                return {
                    ...node,
                    disabled: true, // 父节点禁用
                    children: disableParentNodes(node.children)
                }
            } else {
                return {
                    ...node,
                    disabled: false // 叶子节点可选
                }
            }
        })
    }
    function getProjectTree() {
        post('/solution-ppm/api/v2/built-in-system-ppm/v2/platform/project/tree', {}).then(data => {
            taskState.projectTree = disableParentNodes(data.data)
        })
    }
    function handlerAddOtherPeople(name, index) {
        if (taskState.otherTaskForm.taskList[index].taskParticipantList.indexOf(name) !== -1) {
            taskState.otherTaskForm.taskList[index].taskParticipantList = taskState.otherTaskForm.taskList[
                index
            ].taskParticipantList.filter(item => item !== name)
        } else {
            taskState.otherTaskForm.taskList[index].taskParticipantList.push(name)
        }
    }
    const ptOtherRef = ref(null)
    // 保存其他任务
    function confirmOtherMb() {
        ptOtherRef.value.validate().then(() => {
            taskState.otherOkLoading = true

            //   新建
            taskState.otherTaskForm.taskList.forEach(item => {
                item.startTime = item.allTime[0]
                item.endTime = item.allTime[1]
            })
            post(
                `/solution-ppm/api/v2/built-in-system-ppm/v3/platform_task/child_task/${taskState.otherTaskForm.taskList[0].projectId}`,
                {
                    dataList: taskState.otherTaskForm.taskList
                }
            )
                .then(data => {
                    if (data.code !== 200) {
                        message.error(data.message)
                        return
                    }
                    message.success(data.message)
                    cancelOtherMb()
                    getData()
                })
                .finally(() => {
                    taskState.otherOkLoading = false
                })
        })
    }
    const PromiseProxy = Promise
    // 关闭其他任务新建
    function cancelOtherMb() {
        taskState.otherTaskVisible = false
        taskState.otherTaskForm = {
            taskList: [
                {
                    taskParticipantList: [],
                    allTile: [],
                    startTime: undefined,
                    endTime: undefined,
                    taskName: undefined,
                    workingHours: undefined,
                    taskOwner: taskLeader.value.name,
                    assessorName: taskLeader.value.name,
                    parentId: undefined,
                    storyId: undefined,
                    taskId: undefined,
                    description: undefined,
                    sopTaskList: []
                }
            ]
        }
        currentOtherTask.value = {}
    }
    //     转任务
</script>
<style lang="less" scoped>
    .page_root {
        width: 100%;
        height: 100%;
        overflow: auto;
    }
    .page_root :deep(.@{ant-prefix}-spin-nested-loading),
    .page_root :deep(.@{ant-prefix}-spin-container) {
        height: 100%;
    }
    .page_root :deep(.@{ant-prefix}-spin-container .@{ant-prefix}-table-wrapper) {
        display: flex;
        flex-flow: column nowrap;
        justify-content: flex-start;
    }
    .page_root :deep(.@{ant-prefix}-table) {
        flex: auto;
        overflow: auto;
    }
    .table-moreBtn_down {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100px;
    }

    .table-moreBtn_menu :deep(.table-moreBtn_menu-item):hover {
        background: #ebf1ff;
    }

    /*  表格树结构样式处理，展开按钮层级增加*/
    :deep(.@{ant-prefix}-table-row-expand-icon) {
        z-index: 1;
    }
    /*  表格树结构 由于每个表格项采用自定义组件，使用绝对定位布局，开启树结构导致显示异常，暂时使用层级定位位置 */
    :deep(.@{ant-prefix}-table-row-level-1 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 15px !important;
        width: calc(100% - 15px);
    }
    :deep(.@{ant-prefix}-table-row-level-2 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 30px !important;
        width: calc(100% - 30px);
    }
    :deep(.@{ant-prefix}-table-row-level-3 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 45px !important;
        width: calc(100% - 45px);
    }
    :deep(.@{ant-prefix}-table-row-level-4 .@{ant-prefix}-table-cell-with-append .cell-wrapper-left) {
        left: 60px !important;
        width: calc(100% - 60px);
    }

    /* 穿梭框改变默认样式，为根据组件样式控制左右栏宽度。 */
    :deep(.@{ant-prefix}-transfer-list) {
        height: 100%;
        width: 50%;
    }

    /*样式*/
    .page_root {
        width: 100%;
        height: 100%;
        overflow: hidden;
        background-color: #f0f2f5;
    }
    .body {
        background-color: #f0f2f5;
        height: 100%;
    }
    .top-tab {
        height: 65px;
        padding: 16px 24px;
        background-color: #fff;
        margin-bottom: 16px;
        border-radius: 2px;
    }
    .kb-table-box {
        padding: 0 24px;
        padding-bottom: 24px;
        border-radius: 2px;
        background-color: #fff;
    }
    .time-div {
        display: flex;
        flex-direction: column;
        height: 65px;
    }
    .reality-time,
    .plan-time {
        height: 32px;
        width: 100%;
        text-align: center;
        line-height: 32px;
    }
    .plan-time {
        border-bottom: 1px solid #d9d9d9;
    }
    .kb-table-box:deep(.@{ant-prefix}-table-thead) > tr > th {
        background: #3875ff;
        color: #fff;
        font-weight: 600;
        padding: 8px 16px;
        border-right: 1px solid #d9d9d9 !important;
        position: relative;
    }
    .kb-table-box :deep(.@{ant-prefix}-table-tbody) tr > td {
        font-size: 14px;
        font-family: arial, helvetica, 'microsoft yahei';
        font-weight: 400;
        color: #262626;
        border-bottom: 1px solid #d9d9d9;
        padding: 8px 4px;
        word-break: break-all;
    }

    .record-top,
    .record-bottom {
        display: flex;
        height: 32px;
    }
    .record-top {
        border-bottom: 1px solid #d9d9d9;
    }
    .extension,
    .normal,
    .planning {
        width: 25%;
        height: 32px;
        background-color: orange;
    }
    .normal {
        background-color: normal;
    }
    .planning {
        background-color: planning;
    }
    .table-tip {
        background-color: #fff;
        display: flex;
        height: 45px;
        justify-content: space-between;
        padding: 0 24px;
        align-items: center;
        position: relative;
    }

    .finish,
    .running,
    .daily {
        display: flex;
        line-height: 62px;
        margin-right: 13px;
    }

    .left-top {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 16px;
    }

    .right {
        flex: 1;
        display: flex;
        justify-content: end;
    }

    .tip-msg {
        font-size: 14px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 400;
    }

    .running-box {
        background: #aae56a;
    }

    .daily-box {
        background: #faba32;
    }
    .main {
        padding-top: 8px;
        background-color: #fff;
        height: 100%;
    }
    .color-father {
        width: 100px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .no-margin {
        margin: 0;
    }
    .region-title {
        height: 26px;
        background: #fef0cc;
        border-radius: 2px;
        padding-left: 6px;
        font-size: 12px;
        color: #595959;
        line-height: 26px;
        font-weight: 400;
        margin-bottom: 16px;
    }
    .no-data-img {
        width: 264px;
        height: 192px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .no-data-msg {
        position: absolute;
        top: 60%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #595959;
    }
    .right-top {
        width: 50%;
        display: flex;
        align-items: center;
        justify-content: end;
        gap: 20px;
        color: #595959;
    }
    .tip-top-box {
        padding: 0 5px;
        border-radius: 2px;
        color: #fff;
        font-weight: 800;
    }
    .text-line-div {
        text-decoration: underline;
        position: relative;
    }

    .db-click {
        height: 30px;
        line-height: 30px;
    }
    .db-click-name {
        width: 180px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .file-div {
        padding: 10px;
        width: 280px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .progress-click,
    .question-div,
    .productionPlan-div {
        height: 30px;
        line-height: 30px;
        display: flex;
    }
    :deep(.ant3-checkbox-wrapper + .ant3-checkbox-wrapper) {
        margin: 0;
    }
    .color-div {
        height: 40px;
        line-height: 40px;
    }
    .box {
        display: flex;
        width: 50%;
        height: 50%; /* 19px, 38px 的一半 */
        line-height: 20px;
        box-sizing: border-box; /* 包含 padding 和 border */
        font-size: 14px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 400;
    }
    .top-search {
        margin-bottom: 14px;
        padding: 16px 24px;
        padding-bottom: 10px;
        background-color: #fff;
    }
    .remark-content {
        padding: 10px 14px;
        border-radius: 5px;
        border: 1px solid #d9d9d9;
    }
    .remark-content p {
        margin-bottom: 0;
    }
    .tip1 {
        margin-left: 24px;
        display: flex;
        align-items: center;
    }
    .box1 {
        width: 32px;
        height: 8px;
        margin-left: 8px;
    }
    .tip-title {
        font-size: 16px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 600;
        line-height: 16px;
        padding-left: 8px;
        border-left: 4px solid #3875ff;
        height: 16px;
    }
    .title-font {
        font-size: 14px;
        color: #595959;
        letter-spacing: 0;
        text-align: center;
        font-weight: 400;
    }
    .marks-title {
        font-size: 16px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 600;
        margin-bottom: 8px;
    }
    .content-msg {
        width: 200px; /* 设置固定宽度 */
        word-wrap: break-word; /* 允许长单词换行 */
        overflow-wrap: break-word; /* 处理溢出 */
        white-space: normal; /* 正常换行 */
        flex-shrink: 0; /* 防止内容缩小 */
        text-align: left;
    }
    .toggle-icon {
        cursor: pointer; /* 鼠标指针样式 */
        color: #3875ff;
        position: relative;
        top: 1px;
        left: -6px;
        fontsize: 16px;
    }
    .icon-right {
        color: #3875ff;
        cursor: pointer;
    }
    .toggle-icon {
        fontsize: 16px;
    }
    .top-search :deep(.ant3-col-6) {
        height: 32px;
    }
    .kb-table-box :deep(.ant3-table-column-sorter-inner) {
        position: relative;
        left: -5px;
    }
    .omit-div,
    .omit-div-question,
    .omit-div-productionPlan,
    .omit-div-customerRelationship {
        width: 320px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        height: 100%;
        padding: 0 8px;
    }
    /* .question-div,
    .productionPlan-div,
    .kqjh-div {
        width: 320px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        height: 100%;
        padding: 0 8px;
        cursor: pointer;
        line-height: 35px;
    }
    */

    .my-page :deep(.ant3-form-item-label) {
        width: 100px;
    }
    .form-content :deep(.ant3-form-item-label) {
        width: 120px;
    }

    .bottom-form :deep(.ant3-form-item-label) {
        width: 65px;
    }
    .modal-title {
        padding-left: 8px;
        border-left: 4px solid #3875ff;
        height: 16px;
        line-height: 16px;
        margin-top: 10px;
        font-size: 16px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 600;
        margin-bottom: 16px;
    }
    .col-height {
        height: 32px;
        margin-bottom: 16px;
    }
    .supportors {
        padding-right: 8px;
        width: 80px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .support-div {
        width: 120px;
        max-height: 100px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .top-num {
        height: 150px;
        background: #ffffff;
        border-radius: 4px;
        padding: 16px 24px;
        margin-bottom: 16px;
    }
    .num-content {
        display: flex;
        justify-content: space-between;
        gap: 16px;
        margin-top: 16px;
    }
    .num-item {
        flex: 1;
        display: flex;
        flex-direction: column;
        background: #ebf1ff;
        border: 1px solid #3875ff;
        border-radius: 4px;
        height: 80px;
        padding: 14px;
        text-align: center;
    }
    .total-num .num-bottom {
        font-size: 22px;
        color: #3875ff;
        letter-spacing: 0;
        font-weight: 500;
    }
    .num-bottom {
        font-size: 22px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 500;
    }
    .num-top {
        display: flex;
        gap: 4px;
        font-size: 14px;
        color: #595959;
        letter-spacing: 0;
        font-weight: 400;
        justify-content: center;
        align-items: center;
    }
    .ys-icon,
    .zzyx-icon,
    .yz-cion,
    .sys-icon,
    .jm-icon,
    .sjjm-icon {
        height: 16px;
        width: 16px;
    }
    .ys-icon {
        background-image: url('http://10.40.0.33:9001/file-storage/477573594104686592-source.png');
        background-size: cover;
    }
    .zzyx-icon {
        background-image: url('http://10.40.0.33:9001/file-storage/477573430939969536-source.png');
        background-size: cover;
    }
    .sys-icon {
        background-image: url('http://10.40.0.33:9001/file-storage/477573262773544960-source.png');
        background-size: cover;
    }
    .jm-icon {
        background-image: url('http://10.40.0.33:9001/file-storage/476874760477173760-source.png');
        background-size: cover;
    }
    .sjjm-icon {
        background-image: url('http://10.40.0.33:9001/file-storage/477573098140821504-source.png');
        background-size: cover;
    }
    .yz-cion {
        background-image: url('http://10.40.0.33:9001/file-storage/477573586028554240-source.png');
        background-size: cover;
    }
    .nums-top {
        font-size: 18px;
        color: #262626;
        letter-spacing: 0;
        line-height: 24px;
        font-weight: 500;
    }

    .del {
        width: 28px;
        color: #3875ff;
        position: absolute;
        right: 0;
        top: 5px;
    }

    .add-btn {
        position: absolute;
        right: 40px;
        color: #3875ff;
        top: 5px;
    }
    .my-page:deep(.ant3-picker) {
        width: 100%;
    }

    .form-content {
        display: inline-block;
        width: 100%;
    }
    .wt-item,
    .jz-item {
        position: relative;
    }
    .wt-item:last-child,
    .jz-item:last-child {
        border-bottom: none;
        margin-bottom: 0;
    }
    .jz-item {
        margin-bottom: 16px;
    }
    .bottom-title {
        display: flex;
        justify-content: space-between;
        align-items: start;
        margin-bottom: 16px;
    }
    .time-title {
        display: flex;
        justify-content: space-between;
        margin-bottom: 16px;
    }

    .jz-content {
        border-radius: 2px;
        background-color: #fff;
        padding: 5px 8px;
        border: 1px solid #d9d9d9;
    }
    .jz-body,
    .wt-body {
        background: #ecf2ff;
        border-radius: 4px;
        padding: 16px;
    }
    .wt-body {
        margin-bottom: 16px;
    }
    .jz-body {
        margin-bottom: 16px;
    }
    .jz-img,
    .wt-img {
        width: 16px;
        height: 16px;
    }
    .jz-img {
        background-image: url('http://10.40.0.33:9001/file-storage/477569053894338560-source.png');
        background-size: cover;
    }
    .wt-img {
        background-image: url('http://10.40.0.33:9001/file-storage/477569076266756096-source.png');
        background-size: cover;
    }
    .title-left {
        font-size: 16px;
        color: #3875ff;
        letter-spacing: 0;
        text-align: center;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 2px;
    }
    .title-tip {
        display: flex;
        gap: 16px;
        margin-bottom: 8px;
    }
    .wt-title-tip {
        height: 36px;
        align-items: top;
        display: flex;
        gap: 16px;
        margin-bottom: 16px;
        border-bottom: 1px solid #3875ff;
    }
    .title-key {
        font-size: 14px;
        color: #595959;
        letter-spacing: 0;
        text-align: right;
        font-weight: 400;
    }
    .title-value {
        font-size: 14px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 400;
    }
    .draw-title {
        border-left: 4px solid #3875ff;
        padding-left: 8px;
        height: 16px;
        line-height: 16px;
    }
    .risk-level-tool-tip {
        margin: 0;
    }
    .statistics-div:deep(.ant3-form-item-label) {
        width: 120px;
    }
    .statisics-form-content {
        background: #f7f7f7;
        padding: 16px 24px;
        padding-left: 0;
    }
    .select-list {
        position: relative;
    }
    .form-content-select {
        width: calc(100% - 120px);
    }
    .select-btn {
        position: absolute;
        right: 16px;
        top: 0;
    }
    .select-btn :deep(.ant3-btn) {
        padding: 0;
    }
    .componment-item {
        margin-bottom: 16px;
    }
    .componment-item:last-child {
        margin-bottom: 0;
    }
    :deep(.ant3-table) {
        table-layout: auto; /* 这样表格列宽会自动调整 */
    }
    .top-classification {
        padding: 0 24px;
        display: flex;
        gap: 16px;
        justify-content: space-between;
        margin-top: 12px;
        margin-bottom: 16px;
    }
    .classification-item,
    .total-item {
        height: 48px;
        line-height: 48px;
        padding: 0 16px;
        position: relative;
        font-size: 14px;
        color: #262626;
        letter-spacing: 0;
        font-weight: 400;
    }
    .classification-item {
        text-align: center;
        display: flex;
        align-items: center; /* 垂直居中对齐内容 */
        padding: 5px 10px; /* 内边距 */
        border-radius: 4px; /* 边框圆角 */
        box-sizing: border-box; /* 确保内边距不影响宽度计算 */
        flex-grow: 1; /* 允许元素伸展，占据可用空间 */
        min-width: 150px; /* 设置最小宽度，避免元素过小 */
    }
    .total-num {
        width: 10%;
        background: #ebf1ff;
        border: 1px solid #3875ff;
        border-radius: 4px;
    }
    .other-num {
        flex: 1;
        display: flex;
        background: #ebf1ff;
        border: 1px solid #3875ff;
        border-radius: 4px;
        display: flex;
        padding: 0 40px;
        flex-wrap: wrap; /* 允许换行 */
        gap: 16px; /* 设置子元素间的间距 */
        justify-content: space-between; /* 分配空余空间，使项均匀分布 */
    }
    .border-item {
        position: absolute;
        height: 36px;
        width: 1px;
        background-color: #3875ff;
        right: 0;
        top: 6px;
    }
    .meeting-div :deep(.ant3-form-item-label) {
        width: 130px;
    }
    .gd-form-content :deep(.ant3-form-item-label) {
        width: 135px;
    }
    .gd-form-content :deep(.ant3-input-number),
    :deep(.ant3-picker) {
        width: 100%;
    }
    .gd-form-content :deep(.ql-snow .ql-editor) img {
        width: 200px;
    }
    :deep(.ql-editor) {
        min-height: 110px;
        background: #ffffff;
    }
    .faq-my-page :deep(.ant3-form-item-label) {
        width: 75px;
    }
    .bottom-item {
        border: 1px solid #d9d9d9;
        padding: 16px;
        margin-bottom: 16px;
    }
    .module-item,
    .module-item-two {
        position: relative;
        width: calc(100% - 60px);
    }
    .module-item-two {
        border-bottom: 1px solid #d9d9d9;
        margin-bottom: 16px;
    }
    .faq-form-content {
        display: inline-block;
        width: calc(100% - 80px);
    }
    .faq-del {
        width: 28px;
        color: #3875ff;
        position: absolute;
        right: 35px;
        top: 5px;
    }
    .faq-add-btn {
        position: absolute;
        right: -35px;
        color: #3875ff;
        top: 5px;
    }
    .validate-content {
        position: relative;
    }
    .validate-icon {
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 10px;
        height: 10px;
        background-image: url('http://10.40.0.33:9001/file-storage/492483523888244736-source.png');
        background-size: cover;
    }
    .validate-icon-1 {
        background-image: url('http://10.40.0.33:9001/file-storage/492483523888244736-source.png');
        background-size: cover;
        width: 10px;
        height: 10px;
        position: absolute;
        top: -20px;
    }
    .top-search :deep(.ant3-col) {
        height: 40px;
    }
    .status-div {
        color: #fff;
        width: 60%;
        margin: 0 auto;
        border-radius: 4px;
    }
    /*转任务*/
    .mbtask-form :deep(.ant3-form-item-label) {
        width: 115px !important;
    }
    /*转任务*/
</style>
